@cqsjjb/jjb-react-admin-component 3.3.1-beta.8 → 3.3.2

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.
@@ -170,7 +170,9 @@ export default props => {
170
170
  }
171
171
  }, node[title])), /*#__PURE__*/React.createElement(Space, null, titleAction ? (titleAction(node) || []).map(item => {
172
172
  return /*#__PURE__*/React.createElement("div", {
173
- onClick: () => {
173
+ onClick: e => {
174
+ e.stopPropagation();
175
+ e.preventDefault();
174
176
  item.onClick && item.onClick(node);
175
177
  },
176
178
  className: "operation"
@@ -18,7 +18,10 @@ export default function FormilyDescriptions({
18
18
  token: sessionStorage.token
19
19
  }
20
20
  }).then(res => res.json()).then(res => {
21
- if (res.success) setRegions(res.data);
21
+ if (res.success) {
22
+ setRegions(res.data);
23
+ props.onLoad && props.onLoad();
24
+ }
22
25
  });
23
26
  }, []);
24
27
  const dataSource = tools.getDynamicFormilyFields(schema, values, {
@@ -85,9 +88,12 @@ export function ItemRender({
85
88
  setOpen(true);
86
89
  };
87
90
  const renderContent = () => {
91
+ const systemStyle = props.systemStyle ? props.systemStyle(data.fieldCode) : {};
88
92
  if (tools.isArray(data.value)) {
89
93
  if (tools.isStringArray(data.value) || tools.isNumberArray(data.value)) {
90
- return data.value.join('、');
94
+ return /*#__PURE__*/React.createElement("div", {
95
+ style: systemStyle
96
+ }, data.value.join('、'));
91
97
  }
92
98
  if (tools.isObjectArray(data.value)) {
93
99
  return data.formType === 'Table' ? /*#__PURE__*/React.createElement(RenderTable, {
@@ -97,7 +103,8 @@ export function ItemRender({
97
103
  imageHeight: imageHeight,
98
104
  imagePreview: imagePreview,
99
105
  extraFileLink: extraFileLink,
100
- onPreview: handlePreview
106
+ onPreview: handlePreview,
107
+ systemStyle: systemStyle
101
108
  }) : data.value.map((file, index) => /*#__PURE__*/React.createElement(RenderFileItem, {
102
109
  key: index,
103
110
  url: file.url,
@@ -107,7 +114,8 @@ export function ItemRender({
107
114
  imageHeight: imageHeight,
108
115
  imagePreview: imagePreview,
109
116
  extraFileLink: extraFileLink,
110
- onPreview: () => handlePreview(file.url)
117
+ onPreview: () => handlePreview(file.url),
118
+ systemStyle: systemStyle
111
119
  }));
112
120
  }
113
121
  return tools.textPlaceholder();
@@ -116,7 +124,8 @@ export function ItemRender({
116
124
  name: data.name,
117
125
  value: data.value,
118
126
  maxTagCount: props.maxTagCount,
119
- renderItemText: props.renderItemText
127
+ renderItemText: props.renderItemText,
128
+ systemStyle: systemStyle
120
129
  });
121
130
  };
122
131
  return /*#__PURE__*/React.createElement(Fragment, null, renderContent(), /*#__PURE__*/React.createElement(Modal, {
@@ -141,7 +150,8 @@ export function RenderText({
141
150
  value,
142
151
  name,
143
152
  maxTagCount = 1,
144
- renderItemText
153
+ renderItemText,
154
+ systemStyle
145
155
  }) {
146
156
  const [text, setText] = useState();
147
157
  const [options, setOptions] = useState([]);
@@ -168,7 +178,8 @@ export function RenderText({
168
178
  width: '100%',
169
179
  display: 'flex',
170
180
  minHeight: 22,
171
- flexDirection: 'column'
181
+ flexDirection: 'column',
182
+ ...systemStyle
172
183
  }
173
184
  }, /*#__PURE__*/React.createElement(Spin, {
174
185
  spinning: loading
@@ -185,10 +196,14 @@ export function RenderText({
185
196
  maxTagCount: maxTagCount
186
197
  })));
187
198
  }
188
- return renderItemText ? renderItemText({
199
+ return /*#__PURE__*/React.createElement("div", {
200
+ style: {
201
+ ...systemStyle
202
+ }
203
+ }, renderItemText ? renderItemText({
189
204
  text,
190
205
  name
191
- }) : tools.textPlaceholder(text);
206
+ }) : tools.textPlaceholder(text));
192
207
  }
193
208
  export function RenderFileItem(props) {
194
209
  const {
@@ -199,16 +214,22 @@ export function RenderFileItem(props) {
199
214
  imageHeight,
200
215
  imagePreview,
201
216
  extraFileLink,
202
- onPreview
217
+ onPreview,
218
+ systemStyle
203
219
  } = props;
204
220
  return isImage ? /*#__PURE__*/React.createElement(RenderImage, {
205
221
  url: url,
206
222
  imageWidth: imageWidth,
207
223
  imageHeight: imageHeight,
208
224
  imagePreview: imagePreview,
209
- extraFileLink: extraFileLink
225
+ extraFileLink: extraFileLink,
226
+ systemStyle: systemStyle
210
227
  }) : /*#__PURE__*/React.createElement(Tooltip, {
211
228
  title: url
229
+ }, /*#__PURE__*/React.createElement("div", {
230
+ style: {
231
+ ...systemStyle
232
+ }
212
233
  }, IS_PDF_REG.test(url) || IS_VIDEO_REG.test(url) ? /*#__PURE__*/React.createElement(RenderValidFile, {
213
234
  url: url,
214
235
  name: name,
@@ -217,20 +238,25 @@ export function RenderFileItem(props) {
217
238
  }) : /*#__PURE__*/React.createElement(RenderInvalidFile, {
218
239
  url: url,
219
240
  name: name
220
- }));
241
+ })));
221
242
  }
222
243
  export function RenderImage({
223
244
  url,
224
245
  imageWidth,
225
246
  imageHeight,
226
247
  imagePreview,
227
- extraFileLink
248
+ extraFileLink,
249
+ systemStyle
228
250
  }) {
229
251
  return /*#__PURE__*/React.createElement("span", {
230
252
  style: {
231
253
  display: 'inline-block',
232
254
  marginRight: 4,
233
- marginBottom: 4
255
+ marginBottom: 4,
256
+ ...(systemStyle ? {
257
+ ...systemStyle,
258
+ border: `1px solid ${systemStyle?.color || '#d9d9d9'}`
259
+ } : {})
234
260
  }
235
261
  }, /*#__PURE__*/React.createElement(Image, {
236
262
  src: url,
@@ -279,12 +305,17 @@ export function RenderTable({
279
305
  imageHeight,
280
306
  imagePreview,
281
307
  extraFileLink,
282
- onPreview
308
+ onPreview,
309
+ systemStyle
283
310
  }) {
284
311
  const renderColumn = col => {
285
312
  const originalRender = col.render;
286
313
  col.render = row => {
287
- if (tools.isNumberArray(row) || tools.isStringArray(row)) return row.join(',');
314
+ if (tools.isNumberArray(row) || tools.isStringArray(row)) {
315
+ return /*#__PURE__*/React.createElement("div", {
316
+ style: systemStyle
317
+ }, row.join(','));
318
+ }
288
319
  if (tools.isUploadFileListArray(row)) {
289
320
  return /*#__PURE__*/React.createElement(Space, {
290
321
  direction: "vertical"
@@ -297,7 +328,8 @@ export function RenderTable({
297
328
  imageHeight: imageHeight,
298
329
  imagePreview: imagePreview,
299
330
  extraFileLink: extraFileLink,
300
- onPreview: () => onPreview(file.url)
331
+ onPreview: () => onPreview(file.url),
332
+ systemStyle: systemStyle
301
333
  })));
302
334
  }
303
335
  if (tools.isObject(row)) return '数据错误';
@@ -308,6 +340,7 @@ export function RenderTable({
308
340
  return /*#__PURE__*/React.createElement(Table, {
309
341
  rowKey: (record, index) => index,
310
342
  columns: columns.map(renderColumn),
311
- dataSource: dataSource
343
+ dataSource: dataSource,
344
+ style: systemStyle
312
345
  });
313
346
  }
@@ -59,7 +59,8 @@ const ListDataContainer = /*#__PURE__*/forwardRef(({
59
59
  showQuickJumper: true
60
60
  },
61
61
  tableProps = {},
62
- proTable = false
62
+ proTable = false,
63
+ onRest = () => {}
63
64
  }, ref) => {
64
65
  const [form] = Form.useForm();
65
66
  const [tableData, setTableData] = useState([]);
@@ -130,12 +131,12 @@ const ListDataContainer = /*#__PURE__*/forwardRef(({
130
131
  obj[item.name] = undefined;
131
132
  return obj;
132
133
  }, {}));
134
+ onRest && onRest(form);
133
135
  // 重置分页并使用内部默认参数查询
134
136
  setPagination(initialPagination);
135
137
  loadDataSource();
136
138
  };
137
139
  const handlePaginationChange = newPagination => {
138
- console.warn("ssssssssssss", newPagination);
139
140
  // 更新分页后,用新分页参数查询
140
141
  setPagination({
141
142
  ...newPagination,
@@ -0,0 +1 @@
1
+ <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M938.667 426.667v-85.334c0-46.933-38.4-85.333-85.334-85.333H128c-46.933 0-85.333 38.4-85.333 85.333v341.334C42.667 729.6 81.067 768 128 768h725.333c46.934 0 85.334-38.4 85.334-85.333v-85.334c23.466 0 42.666-19.2 42.666-42.666v-85.334c0-23.466-19.2-42.666-42.666-42.666zM896 469.333v213.334c0 23.466-19.2 42.666-42.667 42.666H128c-23.467 0-42.667-19.2-42.667-42.666V341.333c0-23.466 19.2-42.666 42.667-42.666h725.333c23.467 0 42.667 19.2 42.667 42.666v128zM128 682.667h554.667V341.333H128v341.334z" fill="#2C2C2C" /></svg>
package/PhoneBox/index.js CHANGED
@@ -1,6 +1,12 @@
1
1
  import React, { useEffect, useState, useRef } from 'react';
2
2
  import { Empty, Space, message, Tooltip, Button, QRCode } from 'antd';
3
3
  import { SyncOutlined } from '@ant-design/icons';
4
+ import { http } from '@cqsjjb/jjb-common-lib';
5
+ import shexiang from './shexiang.svg';
6
+ import xinhao from './xinhao.svg';
7
+ import wangluo from './wangluo.svg';
8
+ import dianchi from './dianchi.svg';
9
+ import phone from './phone.svg';
4
10
  import './index.less';
5
11
  export default props => {
6
12
  const {
@@ -36,7 +42,7 @@ export default props => {
36
42
  useEffect(() => {
37
43
  const handleClickOutside = e => {
38
44
  const button = qrcodeButtonRef.current;
39
- const tooltip = document.querySelector('.micro-temp-tooltip');
45
+ const tooltip = document.querySelector(`.${window.process.env.app?.antd?.['ant-prefix'] || 'ant'}-tooltip`);
40
46
  if (button && !button.contains(e.target) && tooltip && !tooltip.contains(e.target)) {
41
47
  setQrcodeVisible(false);
42
48
  }
@@ -69,6 +75,17 @@ export default props => {
69
75
  };
70
76
  }, []);
71
77
 
78
+ // 获取预览地址
79
+ const getPreviewUrl = () => {
80
+ // 从url中解析出id
81
+ const url = new URL(iframeUrl);
82
+ const hash = url.hash.substring(1);
83
+ const queryString = hash.replace(/^\//, '');
84
+ const params = new URLSearchParams(queryString);
85
+ const id = params.get('sceneEngineId');
86
+ return http.Get(`/scene/engine/preview/url/${id}`);
87
+ };
88
+
72
89
  // 二维码过期状态定时器
73
90
  const startQrcodeTimer = () => {
74
91
  if (qrcodeTimerId.current) {
@@ -90,25 +107,19 @@ export default props => {
90
107
  }, 60000);
91
108
  };
92
109
  const getQrCodeUrl = () => {
93
- if (fetchQrcodeUrl) {
94
- fetchQrcodeUrl().then(res => {
95
- setQrcodeUrl(res.data);
96
- setIsQrcodeExpire(false); // 重置二维码过期状态
97
- startQrcodeTimer(); // 启动过期状态定时器
98
- startQrcodeExpireTimeUpdateTimer(); // 启动过期时间定时器
99
- });
100
- } else {
101
- setQrcodeUrl(`${iframeUrl}?t=${Date.now()}`);
110
+ const ftechFunc = fetchQrcodeUrl || getPreviewUrl;
111
+ ftechFunc().then(res => {
112
+ setQrcodeUrl(res.data);
102
113
  setIsQrcodeExpire(false); // 重置二维码过期状态
103
114
  startQrcodeTimer(); // 启动过期状态定时器
104
115
  startQrcodeExpireTimeUpdateTimer(); // 启动过期时间定时器
105
- }
116
+ });
106
117
  };
107
118
  return /*#__PURE__*/React.createElement("div", {
108
119
  className: `phone-box ${size === 'small' ? 'phone-box-small' : ''}`
109
120
  }, /*#__PURE__*/React.createElement("img", {
110
121
  alt: "",
111
- src: require('~/assets/phone.png').default,
122
+ src: phone,
112
123
  width: 356,
113
124
  height: 720
114
125
  }), /*#__PURE__*/React.createElement("div", {
@@ -118,7 +129,7 @@ export default props => {
118
129
  }, /*#__PURE__*/React.createElement("div", {
119
130
  className: "phone-header-time"
120
131
  }, currentTime), /*#__PURE__*/React.createElement("img", {
121
- src: require('~/assets/shexiang.png').default,
132
+ src: shexiang,
122
133
  width: 76,
123
134
  height: 23,
124
135
  alt: ""
@@ -126,15 +137,15 @@ export default props => {
126
137
  className: "phone-header-status"
127
138
  }, /*#__PURE__*/React.createElement("img", {
128
139
  className: "status-xinhao",
129
- src: require('~/assets/xinhao.png').default,
140
+ src: xinhao,
130
141
  alt: ""
131
142
  }), /*#__PURE__*/React.createElement("img", {
132
143
  className: "status-wangluo",
133
- src: require('~/assets/wangluo.png').default,
144
+ src: wangluo,
134
145
  alt: ""
135
146
  }), /*#__PURE__*/React.createElement("img", {
136
147
  className: "status-dianchi",
137
- src: require('~/assets/dianchi.png').default,
148
+ src: dianchi,
138
149
  alt: ""
139
150
  }))), showEmpty && !iframeUrl ? /*#__PURE__*/React.createElement("div", {
140
151
  style: {
@@ -15,7 +15,7 @@
15
15
 
16
16
  .phone-content-header {
17
17
  height: 55px;
18
- padding: 12px 24px;
18
+ padding: 0px 24px;
19
19
  display: flex;
20
20
  align-items: center;
21
21
  justify-content: space-between;
@@ -0,0 +1,135 @@
1
+ <svg width="356" height="720" viewBox="0 0 356 720" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g id="&#230;&#168;&#161;&#229;&#158;&#139;&#230;&#161;&#134;">
3
+ <g id="Body">
4
+ <path id="Base" d="M296.829 1.35898e-06L59.1059 6.55458e-06C28.1243 7.23171e-06 3.00879 25.189 3.00879 56.2613L3.0088 663.739C3.0088 694.811 28.1243 720 59.1059 720L296.829 720C327.811 720 352.926 694.811 352.926 663.739L352.926 56.2613C352.926 25.189 327.811 6.81854e-07 296.829 1.35898e-06Z" fill="#E0E1E3"/>
5
+ <g id="Light" style="mix-blend-mode:overlay">
6
+ <path d="M296.393 1.67594L59.5392 1.67594C29.2431 1.67594 4.67871 26.3122 4.67871 56.697L4.67873 663.286C4.67873 693.671 29.2431 718.307 59.5392 718.307L296.393 718.307C326.69 718.307 351.254 693.671 351.254 663.286L351.254 56.697C351.254 26.3122 326.69 1.67593 296.393 1.67594ZM349.583 662.85C349.583 692.565 325.57 716.648 295.942 716.648L59.9904 716.648C30.3627 716.648 6.34977 692.565 6.34977 662.85L6.34976 57.1495C6.34976 27.4351 30.3627 3.35188 59.9904 3.35188L295.959 3.35187C325.587 3.35187 349.6 27.4351 349.6 57.1495L349.6 662.867L349.583 662.85Z" fill="black"/>
7
+ </g>
8
+ <path id="Frame" d="M295.425 5.49709L60.5257 5.49709C32.0359 5.49709 8.94043 28.6602 8.94043 57.2333L8.94044 662.767C8.94044 691.34 32.0359 714.503 60.5257 714.503L295.425 714.503C323.915 714.503 347.01 691.34 347.01 662.767L347.01 57.2333C347.01 28.6602 323.915 5.49709 295.425 5.49709Z" fill="#1D1D1B"/>
9
+ </g>
10
+ <g id="Buttons">
11
+ <g id="Lock">
12
+ <path id="Base_2" d="M354.98 183.951L352.925 183.951L352.925 270.731L354.98 270.731L354.98 183.951Z" fill="url(#paint0_linear_247_40964)"/>
13
+ <path id="Top-Shade" d="M354.98 270.748L354.98 183.985L356 185.107C355.482 194.342 355.515 260.391 356 269.608L354.98 270.731L354.98 270.748Z" fill="url(#paint1_linear_247_40964)"/>
14
+ </g>
15
+ <g id="Volume-Down">
16
+ <path id="Base_3" d="M1.75469 234.849L0.584961 234.849L0.584962 289.82L1.7547 289.82L1.75469 234.849Z" fill="url(#paint2_linear_247_40964)"/>
17
+ <path id="Top-Shade_2" d="M0.584868 289.82L0.584867 234.866L1.57507e-08 235.587C0.300789 241.436 0.267369 283.284 1.18567e-06 289.116L0.584868 289.837L0.584868 289.82Z" fill="url(#paint3_linear_247_40964)"/>
18
+ <path id="Bottom-Shade" d="M3.00817 234.866L1.75488 234.866L1.75488 289.837L3.00817 289.837L3.00817 234.866Z" fill="url(#paint4_linear_247_40964)"/>
19
+ </g>
20
+ <g id="Volume-Up">
21
+ <path id="Base_4" d="M1.75469 165.7L0.584961 165.7L0.584962 220.671L1.7547 220.671L1.75469 165.7Z" fill="url(#paint5_linear_247_40964)"/>
22
+ <path id="Top-Shade_3" d="M0.584868 220.671L0.584867 165.717L1.57504e-08 166.437C0.300789 172.286 0.267369 214.135 1.18567e-06 219.967L0.584868 220.687L0.584868 220.671Z" fill="url(#paint6_linear_247_40964)"/>
23
+ <path id="Bottom-Shade_2" d="M3.00817 165.7L1.75488 165.7L1.75488 220.671L3.00817 220.671L3.00817 165.7Z" fill="url(#paint7_linear_247_40964)"/>
24
+ </g>
25
+ <g id="Silence">
26
+ <path id="Base_5" d="M1.75469 113.763L0.584961 113.763L0.584962 141.986L1.75469 141.986L1.75469 113.763Z" fill="url(#paint8_linear_247_40964)"/>
27
+ <path id="Top-Shade_4" d="M0.584867 141.969L0.584867 113.763L1.46516e-08 114.433C0.300789 119.964 0.267368 135.768 6.01445e-07 141.282L0.584867 141.952L0.584867 141.969Z" fill="url(#paint9_linear_247_40964)"/>
28
+ <path id="Bottom-Shade_3" d="M3.00817 113.763L1.75488 113.763L1.75488 141.986L3.00817 141.986L3.00817 113.763Z" fill="url(#paint10_linear_247_40964)"/>
29
+ </g>
30
+ </g>
31
+ </g>
32
+ <defs>
33
+ <linearGradient id="paint0_linear_247_40964" x1="353.944" y1="183.951" x2="353.944" y2="270.731" gradientUnits="userSpaceOnUse">
34
+ <stop stop-color="#58595A"/>
35
+ <stop offset="0.02" stop-color="#E0E1E3"/>
36
+ <stop offset="0.04" stop-color="#A7A8A9"/>
37
+ <stop offset="0.08" stop-color="#2B1D2A"/>
38
+ <stop offset="0.11" stop-color="#8C8C8C"/>
39
+ <stop offset="0.9" stop-color="#696969"/>
40
+ <stop offset="0.94" stop-color="#2B1D2A"/>
41
+ <stop offset="0.96" stop-color="#A7A8A9"/>
42
+ <stop offset="0.98" stop-color="#8C8C8C"/>
43
+ <stop offset="1" stop-color="#A7A8A9"/>
44
+ </linearGradient>
45
+ <linearGradient id="paint1_linear_247_40964" x1="355.482" y1="183.968" x2="355.482" y2="270.731" gradientUnits="userSpaceOnUse">
46
+ <stop stop-color="#676067"/>
47
+ <stop offset="0.06" stop-color="#707070"/>
48
+ <stop offset="0.19" stop-color="#8A8A8A"/>
49
+ <stop offset="0.81" stop-color="#8A8A8A"/>
50
+ <stop offset="0.92" stop-color="#707070"/>
51
+ <stop offset="1" stop-color="#676067"/>
52
+ </linearGradient>
53
+ <linearGradient id="paint2_linear_247_40964" x1="-1465.34" y1="234.849" x2="-1465.34" y2="289.82" gradientUnits="userSpaceOnUse">
54
+ <stop stop-color="#58595A"/>
55
+ <stop offset="0.02" stop-color="#E0E1E3"/>
56
+ <stop offset="0.04" stop-color="#A7A8A9"/>
57
+ <stop offset="0.08" stop-color="#2D1E2C"/>
58
+ <stop offset="0.11" stop-color="#8C8C8C"/>
59
+ <stop offset="0.9" stop-color="#696969"/>
60
+ <stop offset="0.94" stop-color="#2D1E2C"/>
61
+ <stop offset="0.96" stop-color="#A7A8A9"/>
62
+ <stop offset="0.98" stop-color="#8C8C8C"/>
63
+ <stop offset="1" stop-color="#A7A8A9"/>
64
+ </linearGradient>
65
+ <linearGradient id="paint3_linear_247_40964" x1="0.300788" y1="234.866" x2="0.300789" y2="289.82" gradientUnits="userSpaceOnUse">
66
+ <stop stop-color="#676067"/>
67
+ <stop offset="0.06" stop-color="#707070"/>
68
+ <stop offset="0.19" stop-color="#8A8A8A"/>
69
+ <stop offset="0.81" stop-color="#8A8A8A"/>
70
+ <stop offset="0.92" stop-color="#707070"/>
71
+ <stop offset="1" stop-color="#676067"/>
72
+ </linearGradient>
73
+ <linearGradient id="paint4_linear_247_40964" x1="0.000284912" y1="289.837" x2="1.68112" y2="234.866" gradientUnits="userSpaceOnUse">
74
+ <stop stop-color="#58595A"/>
75
+ <stop offset="0.05" stop-color="#2D1E2C"/>
76
+ <stop offset="0.52" stop-color="#A7A8A9"/>
77
+ <stop offset="0.96" stop-color="#2D1E2C"/>
78
+ <stop offset="1" stop-color="#A7A8A9"/>
79
+ </linearGradient>
80
+ <linearGradient id="paint5_linear_247_40964" x1="1.16983" y1="165.683" x2="1.16983" y2="220.654" gradientUnits="userSpaceOnUse">
81
+ <stop stop-color="#58595A"/>
82
+ <stop offset="0.02" stop-color="#E0E1E3"/>
83
+ <stop offset="0.04" stop-color="#A7A8A9"/>
84
+ <stop offset="0.08" stop-color="#2D1E2C"/>
85
+ <stop offset="0.11" stop-color="#8C8C8C"/>
86
+ <stop offset="0.9" stop-color="#696969"/>
87
+ <stop offset="0.94" stop-color="#2D1E2C"/>
88
+ <stop offset="0.96" stop-color="#A7A8A9"/>
89
+ <stop offset="0.98" stop-color="#8C8C8C"/>
90
+ <stop offset="1" stop-color="#A7A8A9"/>
91
+ </linearGradient>
92
+ <linearGradient id="paint6_linear_247_40964" x1="0.300788" y1="165.7" x2="0.300789" y2="220.654" gradientUnits="userSpaceOnUse">
93
+ <stop stop-color="#676067"/>
94
+ <stop offset="0.06" stop-color="#707070"/>
95
+ <stop offset="0.19" stop-color="#8A8A8A"/>
96
+ <stop offset="0.81" stop-color="#8A8A8A"/>
97
+ <stop offset="0.92" stop-color="#707070"/>
98
+ <stop offset="1" stop-color="#676067"/>
99
+ </linearGradient>
100
+ <linearGradient id="paint7_linear_247_40964" x1="2.37317" y1="220.688" x2="2.37317" y2="165.7" gradientUnits="userSpaceOnUse">
101
+ <stop stop-color="#58595A"/>
102
+ <stop offset="0.05" stop-color="#2D1E2C"/>
103
+ <stop offset="0.52" stop-color="#A7A8A9"/>
104
+ <stop offset="0.96" stop-color="#2D1E2C"/>
105
+ <stop offset="1" stop-color="#A7A8A9"/>
106
+ </linearGradient>
107
+ <linearGradient id="paint8_linear_247_40964" x1="-1465.34" y1="113.746" x2="-1465.34" y2="141.969" gradientUnits="userSpaceOnUse">
108
+ <stop stop-color="#58595A"/>
109
+ <stop offset="0.02" stop-color="#E0E1E3"/>
110
+ <stop offset="0.04" stop-color="#A7A8A9"/>
111
+ <stop offset="0.08" stop-color="#2D1E2C"/>
112
+ <stop offset="0.11" stop-color="#8C8C8C"/>
113
+ <stop offset="0.9" stop-color="#696969"/>
114
+ <stop offset="0.94" stop-color="#2D1E2C"/>
115
+ <stop offset="0.96" stop-color="#A7A8A9"/>
116
+ <stop offset="0.98" stop-color="#8C8C8C"/>
117
+ <stop offset="1" stop-color="#A7A8A9"/>
118
+ </linearGradient>
119
+ <linearGradient id="paint9_linear_247_40964" x1="0.300789" y1="113.763" x2="0.300789" y2="141.969" gradientUnits="userSpaceOnUse">
120
+ <stop stop-color="#676067"/>
121
+ <stop offset="0.06" stop-color="#707070"/>
122
+ <stop offset="0.19" stop-color="#8A8A8A"/>
123
+ <stop offset="0.81" stop-color="#8A8A8A"/>
124
+ <stop offset="0.92" stop-color="#707070"/>
125
+ <stop offset="1" stop-color="#676067"/>
126
+ </linearGradient>
127
+ <linearGradient id="paint10_linear_247_40964" x1="0.000283675" y1="141.986" x2="2.38698" y2="113.764" gradientUnits="userSpaceOnUse">
128
+ <stop stop-color="#58595A"/>
129
+ <stop offset="0.05" stop-color="#2D1E2C"/>
130
+ <stop offset="0.52" stop-color="#A7A8A9"/>
131
+ <stop offset="0.96" stop-color="#2D1E2C"/>
132
+ <stop offset="1" stop-color="#A7A8A9"/>
133
+ </linearGradient>
134
+ </defs>
135
+ </svg>
@@ -0,0 +1,61 @@
1
+ <svg width="79" height="23" viewBox="0 0 79 23" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g id="&#230;&#145;&#132;&#229;&#131;&#143;&#229;&#164;&#180;">
3
+ <path id="Base" d="M67.2764 22.843L11.3798 22.843C5.0967 22.843 3.87533e-07 17.7314 2.49808e-07 11.4299C1.12084e-07 5.12837 5.0967 1.60769e-06 11.3798 1.47037e-06L67.2764 2.48714e-07C73.5595 1.11392e-07 78.6562 5.11161 78.6562 11.4299C78.6562 17.7314 73.5595 22.843 67.2764 22.843Z" fill="#1D1D1B"/>
4
+ <g id="Lens">
5
+ <path id="Base_2" d="M64.1174 16.4242C66.8676 16.4242 69.0971 14.1882 69.0971 11.4299C69.0971 8.67163 66.8676 6.43561 64.1174 6.43561C61.3672 6.43561 59.1377 8.67163 59.1377 11.4299C59.1377 14.1882 61.3672 16.4242 64.1174 16.4242Z" fill="url(#paint0_linear_247_40986)"/>
6
+ <path id="Frame" d="M64.1171 14.279C65.6861 14.279 66.9579 13.0034 66.9579 11.4299C66.9579 9.85639 65.6861 8.58081 64.1171 8.58081C62.5482 8.58081 61.2764 9.85639 61.2764 11.4299C61.2764 13.0034 62.5482 14.279 64.1171 14.279Z" fill="url(#paint1_linear_247_40986)"/>
7
+ <path id="Bottom-Reflection" d="M66.6076 11.4299C66.6076 12.8042 65.488 13.9271 64.1178 13.9271C62.7475 13.9271 61.6279 12.8042 61.6279 11.4299C61.6279 10.0556 62.7308 8.93276 64.1178 8.93276C65.5048 8.93276 66.6076 10.0389 66.6076 11.4299Z" fill="url(#paint2_linear_247_40986)"/>
8
+ <path id="Top-Reflection" style="mix-blend-mode:multiply" d="M66.6076 11.4299C66.6076 12.8042 65.488 13.9271 64.1178 13.9271C62.7475 13.9271 61.6279 12.8042 61.6279 11.4299C61.6279 10.0556 62.7308 8.93276 64.1178 8.93276C65.5048 8.93276 66.6076 10.0389 66.6076 11.4299Z" fill="url(#paint3_radial_247_40986)"/>
9
+ <path id="Light" style="mix-blend-mode:screen" d="M66.3729 12.7371C66.3729 12.2511 65.9718 11.8489 65.4872 11.8489C65.0026 11.8489 64.6016 12.2511 64.6016 12.7371C64.6016 13.2232 65.0026 13.6254 65.4872 13.6254C65.9718 13.6254 66.3729 13.2232 66.3729 12.7371Z" fill="url(#paint4_radial_247_40986)"/>
10
+ </g>
11
+ </g>
12
+ <defs>
13
+ <linearGradient id="paint0_linear_247_40986" x1="64.1174" y1="16.1058" x2="64.1174" y2="6.28477" gradientUnits="userSpaceOnUse">
14
+ <stop stop-color="#666666"/>
15
+ <stop offset="1" stop-color="#010104"/>
16
+ </linearGradient>
17
+ <linearGradient id="paint1_linear_247_40986" x1="64.1339" y1="8.76517" x2="64.1339" y2="14.3796" gradientUnits="userSpaceOnUse">
18
+ <stop stop-color="#0B131C"/>
19
+ <stop offset="1" stop-color="#354039"/>
20
+ </linearGradient>
21
+ <linearGradient id="paint2_linear_247_40986" x1="65.8724" y1="13.1896" x2="62.3529" y2="9.68046" gradientUnits="userSpaceOnUse">
22
+ <stop stop-color="#231F20"/>
23
+ <stop offset="0.08" stop-color="#212226"/>
24
+ <stop offset="0.2" stop-color="#1F2C37"/>
25
+ <stop offset="0.33" stop-color="#1A3C53"/>
26
+ <stop offset="0.47" stop-color="#13537B"/>
27
+ <stop offset="0.62" stop-color="#0A70AE"/>
28
+ <stop offset="0.78" stop-color="#0095EE"/>
29
+ <stop offset="0.8" stop-color="#0387D6"/>
30
+ <stop offset="0.84" stop-color="#0D689F"/>
31
+ <stop offset="0.88" stop-color="#154D71"/>
32
+ <stop offset="0.91" stop-color="#1B394E"/>
33
+ <stop offset="0.95" stop-color="#1F2A34"/>
34
+ <stop offset="0.98" stop-color="#222225"/>
35
+ <stop offset="1" stop-color="#231F20"/>
36
+ </linearGradient>
37
+ <radialGradient id="paint3_radial_247_40986" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(64.1178 11.4299) scale(2.48986 2.49715)">
38
+ <stop stop-color="#231F20"/>
39
+ <stop offset="0.2" stop-color="#165068"/>
40
+ <stop offset="0.38" stop-color="#0C78A1"/>
41
+ <stop offset="0.54" stop-color="#0594CB"/>
42
+ <stop offset="0.66" stop-color="#01A6E4"/>
43
+ <stop offset="0.73" stop-color="#00ADEE"/>
44
+ <stop offset="0.76" stop-color="#01A5E3"/>
45
+ <stop offset="0.81" stop-color="#0693C8"/>
46
+ <stop offset="0.87" stop-color="#0D749B"/>
47
+ <stop offset="0.94" stop-color="#184A5E"/>
48
+ <stop offset="1" stop-color="#231F20"/>
49
+ </radialGradient>
50
+ <radialGradient id="paint4_radial_247_40986" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(65.4872 12.7371) scale(0.885654 0.888245)">
51
+ <stop stop-color="#CCCCCC"/>
52
+ <stop offset="0.02" stop-color="#C4C4C4"/>
53
+ <stop offset="0.22" stop-color="#898989"/>
54
+ <stop offset="0.41" stop-color="#585858"/>
55
+ <stop offset="0.59" stop-color="#313131"/>
56
+ <stop offset="0.75" stop-color="#161616"/>
57
+ <stop offset="0.89" stop-color="#050505"/>
58
+ <stop offset="1"/>
59
+ </radialGradient>
60
+ </defs>
61
+ </svg>
@@ -0,0 +1 @@
1
+ <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M1012.3915 297.221c-276.295-276.295-724.404-276.295-1000.699 0-15.59 15.59-15.59 40.798 0 56.277 15.59 15.589 40.797 15.589 56.276 0 245.227-245.228 642.92-245.228 888.147 0 15.59 15.589 40.797 15.589 56.276 0 15.479-15.48 15.479-40.687 0-56.277z m-850.666 171.15c-15.59 15.59-15.59 40.798 0 56.277 15.59 15.59 40.797 15.59 56.276 0 162.306-162.306 425.554-162.306 587.86 0 15.589 15.59 40.797 15.59 56.276 0 15.59-15.59 15.59-40.798 0-56.276-193.374-193.374-506.928-193.374-700.412 0z m551.042 181.544l0.221-0.221c-110.562-110.562-289.783-110.562-400.235 0-15.59 15.59-15.59 40.797 0 56.276 15.59 15.59 40.797 15.59 56.276 0 79.494-79.494 208.3-79.494 287.683 0l0.221-0.221a40.39 40.39 0 0 0 2.985 3.317c15.59 15.589 40.798 15.589 56.277 0 15.589-15.59 15.589-40.798 0-56.276-1.217-0.996-2.322-1.88-3.428-2.875zM453.3885 874.909c0 32.974 26.73 59.704 59.704 59.704 32.973 0 59.703-26.73 59.703-59.704 0-32.973-26.73-59.704-59.703-59.704-32.974 0-59.704 26.73-59.704 59.704z" fill="#000000" /></svg>
@@ -0,0 +1 @@
1
+ <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M192.437 816.222c-23.575 0-42.863-19.288-42.863-42.863v-64.294c0-23.575 19.288-42.863 42.863-42.863s42.863 19.288 42.863 42.863v64.294c0.005 23.57-19.284 42.863-42.863 42.863zM406.754 816.222c-23.575 0-42.862-19.288-42.862-42.863v-171.458c0-23.575 19.288-42.862 42.862-42.862s42.863 19.288 42.863 42.862v171.458c0.005 23.57-19.284 42.863-42.863 42.863zM621.080 816.222c-23.575 0-42.862-19.288-42.862-42.863v-342.912c0-23.575 19.288-42.862 42.862-42.862s42.862 19.288 42.862 42.862v342.908c0 23.575-19.288 42.867-42.862 42.867zM835.397 816.222c-23.575 0-42.863-19.288-42.863-42.863v-557.234c0-23.575 19.288-42.863 42.863-42.863s42.863 19.288 42.863 42.863v557.229c0 23.575-19.288 42.867-42.863 42.867z" fill="#2c2c2c" /></svg>
@@ -1,3 +1,4 @@
1
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
1
2
  import React, { useState, useRef, useEffect } from 'react';
2
3
  import { Form, Button, Space, Row, Col } from 'antd';
3
4
  import { SearchOutlined, DoubleRightOutlined, UndoOutlined } from '@ant-design/icons';
@@ -17,14 +18,45 @@ const SearchForm = ({
17
18
  onFinish = () => {},
18
19
  onExpand
19
20
  }) => {
20
- const internalForm = useRef();
21
- const form = externalForm || internalForm;
21
+ // 如果外部没有传入 form,使用 Form.useForm() 创建实例
22
+ const [internalFormInstance] = Form.useForm();
23
+ const internalFormRef = useRef(internalFormInstance);
24
+
25
+ // 判断外部传入的是 ref 还是 form 实例
26
+ // ref 对象有 current 属性,form 实例没有
27
+ const isExternalRef = externalForm && 'current' in externalForm;
28
+
29
+ // 警告:ref 用法将在后续版本中移除
30
+ useEffect(() => {
31
+ if (isExternalRef) {
32
+ console.warn('[SearchForm] 警告:通过 ref 传入 form 的方式已废弃,将在后续版本中移除。' + '请使用 Form.useForm() 创建 form 实例并直接传入,例如:\n' + ' const [form] = Form.useForm();\n' + ' <SearchForm form={form} />');
33
+ }
34
+ }, [isExternalRef]);
35
+
36
+ // 获取实际的 form 实例(兼容 ref 和直接传入实例两种情况)
37
+ const getFormInstance = () => {
38
+ if (externalForm) {
39
+ return isExternalRef ? externalForm.current : externalForm;
40
+ }
41
+ return internalFormInstance;
42
+ };
43
+
44
+ // 兼容性处理:用于 form.current 访问方式的 ref
45
+ const formRef = externalForm && isExternalRef ? externalForm : internalFormRef;
46
+
47
+ // 更新内部 ref,确保 formRef.current 始终指向正确的实例
48
+ useEffect(() => {
49
+ if (!isExternalRef && externalForm) {
50
+ // 如果外部传入的是实例,将其赋值给内部 ref 的 current
51
+ internalFormRef.current = externalForm;
52
+ }
53
+ }, [externalForm, isExternalRef]);
22
54
  const [internalOpen, setInternalOpen] = useState(defaultExpand);
23
55
  useEffect(() => {
24
56
  if (onRef) {
25
- onRef(form);
57
+ onRef(formRef);
26
58
  }
27
- }, [form, onRef]);
59
+ }, [formRef, onRef]);
28
60
  const isControlled = expand !== undefined;
29
61
  const isOpen = isControlled ? expand : internalOpen;
30
62
  const handleToggle = () => {
@@ -47,8 +79,9 @@ const SearchForm = ({
47
79
  icon: /*#__PURE__*/React.createElement(UndoOutlined, null),
48
80
  loading: loading,
49
81
  onClick: () => {
50
- form.current.resetFields();
51
- onReset(form.current.getFieldsValue());
82
+ const formInstance = getFormInstance();
83
+ formInstance.resetFields();
84
+ onReset(formInstance.getFieldsValue());
52
85
  }
53
86
  }, "\u91CD\u7F6E"), formLine.length / colSize > 1 && /*#__PURE__*/React.createElement(Button, {
54
87
  icon: /*#__PURE__*/React.createElement(DoubleRightOutlined, {
@@ -58,8 +91,30 @@ const SearchForm = ({
58
91
  }),
59
92
  onClick: handleToggle
60
93
  }, isOpen ? '收起' : '展开'));
94
+
95
+ /**
96
+ * 处理 formLine,确保所有 Form.Item 都有 noStyle 属性
97
+ * @param {ReactNode[]} nodes - 表单节点数组
98
+ * @returns {ReactNode[]} - 处理后的节点数组
99
+ */
100
+ const processFormLine = nodes => {
101
+ return nodes.map(node => {
102
+ // 检查是否是 Form.Item 组件
103
+ if (/*#__PURE__*/React.isValidElement(node) && node.type === Form.Item) {
104
+ // 如果没有 noStyle 属性,则克隆并添加
105
+ if (!node.props.noStyle) {
106
+ return /*#__PURE__*/React.cloneElement(node, {
107
+ noStyle: true
108
+ });
109
+ }
110
+ }
111
+ return node;
112
+ });
113
+ };
61
114
  const groupsList = () => {
62
- const arr = formLine.map(node => ({
115
+ // 先处理 formLine,确保所有 Form.Item 都有 noStyle
116
+ const processedFormLine = processFormLine(formLine);
117
+ const arr = processedFormLine.map(node => ({
63
118
  show: true,
64
119
  node
65
120
  }));
@@ -73,12 +128,15 @@ const SearchForm = ({
73
128
  };
74
129
  const formItemList = groupsList();
75
130
  if (formItemList.length === 0) return null;
76
- return /*#__PURE__*/React.createElement(Form, {
77
- ref: form,
131
+ return /*#__PURE__*/React.createElement(Form, _extends({}, externalForm && isExternalRef ? {
132
+ ref: externalForm
133
+ } : {
134
+ form: externalForm || internalFormInstance
135
+ }, {
78
136
  style: style,
79
137
  initialValues: initialValues,
80
138
  onFinish: values => onFinish(values)
81
- }, /*#__PURE__*/React.createElement(Row, {
139
+ }), /*#__PURE__*/React.createElement(Row, {
82
140
  gutter: [16, 16]
83
141
  }, formItemList.map((item, index) => /*#__PURE__*/React.createElement(Col, {
84
142
  key: index,
package/Table/index.d.ts CHANGED
@@ -1,17 +1,64 @@
1
- // @ts-ignore
2
- import * as React from 'react';
3
- // @ts-ignore
4
- import type { TableProps } from 'antd';
5
-
6
- export interface OverTableProps extends TableProps {
7
- // 是否禁用内容区滚动,默认-false
8
- disabledResizer?: boolean;
9
- // 当一个路由下存在多个表格的情况下 需要给每一个表格设置一个唯一存储索引 若没有设置则使用默认索引,请注意缓存数据会被覆盖
10
- storeIndex?: string;
11
- }
12
-
13
- interface TableFc extends React.FC<OverTableProps> {
14
- }
15
-
16
- declare const Table: TableFc;
17
- export default Table;
1
+ // @ts-ignore
2
+ import * as React from 'react';
3
+ // @ts-ignore
4
+ import type { TableProps } from 'antd';
5
+
6
+ /**
7
+ * 列设置配置项
8
+ */
9
+ export interface SettingOptionType {
10
+ /** 是否可拖拽排序 */
11
+ draggable?: boolean;
12
+ /** 是否显示复选框 */
13
+ checkable?: boolean;
14
+ /** 是否显示列表项选项 */
15
+ showListItemOption?: boolean;
16
+ /** 重置时是否恢复选中状态 */
17
+ checkedReset?: boolean;
18
+ /** 列表高度 */
19
+ listsHeight?: number;
20
+ /** 额外内容 */
21
+ extra?: React.ReactNode;
22
+ /** 子元素 */
23
+ children?: React.ReactNode;
24
+ /** 自定义设置图标 */
25
+ settingIcon?: React.ReactNode;
26
+ }
27
+
28
+ /**
29
+ * ProTable options 配置项
30
+ */
31
+ export interface OptionConfig {
32
+ /** 是否显示密度切换 */
33
+ density?: boolean;
34
+ /** 是否显示全屏按钮,或自定义函数 */
35
+ fullScreen?: boolean | ((e: React.MouseEvent<HTMLSpanElement>, action?: any) => void);
36
+ /** 是否显示刷新按钮,或自定义函数 */
37
+ reload?: boolean | ((e: React.MouseEvent<HTMLSpanElement>, action?: any) => void);
38
+ /** 列设置配置 */
39
+ setting?: boolean | SettingOptionType;
40
+ /** 搜索配置 */
41
+ search?: boolean | {
42
+ name?: string;
43
+ [key: string]: any;
44
+ };
45
+ /** 自定义刷新图标 */
46
+ reloadIcon?: React.ReactNode;
47
+ /** 自定义密度图标 */
48
+ densityIcon?: React.ReactNode;
49
+ }
50
+
51
+ export interface OverTableProps extends TableProps {
52
+ // 当一个路由下存在多个表格的情况下 需要给每一个表格设置一个唯一存储索引 若没有设置则使用默认索引,请注意缓存数据会被覆盖
53
+ storeIndex?: string;
54
+ // 是否启用自动计算滚动高度,默认-true
55
+ enableAutoScrollY?: boolean;
56
+ // ProTable options 配置项
57
+ options?: OptionConfig | false;
58
+ }
59
+
60
+ interface TableFc extends React.FC<OverTableProps> {
61
+ }
62
+
63
+ declare const Table: TableFc;
64
+ export default Table;
package/Table/index.js CHANGED
@@ -1,118 +1,100 @@
1
1
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
2
- import React from 'react';
3
- import { tools } from '@cqsjjb/jjb-common-lib';
2
+ import React, { useRef, useEffect, useState, useCallback } from 'react';
4
3
  import { ProTable } from '@ant-design/pro-components';
5
- import { useAntdResizableHeader } from 'use-antd-resizable-header';
6
- import { antPrefix, setTableSize, getTableSize, getPersistenceKey } from './utils';
7
4
  import './index.less';
8
- require('use-antd-resizable-header/dist/style.css');
5
+ import { antPrefix } from './utils';
9
6
  export default function TablePro(props) {
10
7
  const prefix = antPrefix || 'ant';
11
8
  const baseCls = `.${prefix}-table`;
12
- const tableCls = `${baseCls}-wrapper`;
9
+ const ref = useRef(null);
13
10
  const tableBodyCls = `${baseCls}-body`;
11
+ const tablePaginationCls = `${baseCls}-pagination`;
12
+ const tableFooterCls = `${baseCls}-footer`;
14
13
  const {
15
- storeIndex
14
+ enableAutoScrollY = true,
15
+ options = {
16
+ reload: false,
17
+ density: true,
18
+ fullScreen: true,
19
+ setting: {
20
+ checkedReset: true,
21
+ draggable: false,
22
+ checkable: true
23
+ }
24
+ },
25
+ ...restProps
16
26
  } = props;
17
- const [size, setSize] = React.useState(getTableSize(storeIndex) || 'default');
18
- const [tableHeight, setTableHeight] = React.useState(0);
19
- const persistenceKey = getPersistenceKey(storeIndex);
20
- const enabledResizer = tools.isUndefined(props.disabledResizer);
21
- React.useEffect(() => {
22
- let mutationObserver, resizeObserver;
23
- if (enabledResizer) {
24
- // 监听-DOM树
25
- mutationObserver = new MutationObserver(mutations => mutations.forEach(() => calcTableHeight()));
26
- // 监听-缩放
27
- resizeObserver = new ResizeObserver(entries => entries.forEach(() => calcTableHeight()));
28
-
29
- // 初始化首次计算
30
- setTimeout(() => calcTableHeight(), 500);
31
-
32
- // 执行-监听-缩放
33
- resizeObserver.observe(document.body);
34
- // 执行-监听-DOM树是否发生变化
35
- mutationObserver.observe(document.body, {
36
- subtree: true,
37
- childList: true
38
- });
27
+ const [scrollY, setScrollY] = useState(undefined);
28
+ const timerRef = useRef(null);
29
+ const calcTableScrollY = () => {
30
+ const tableBody = ref.current?.querySelector?.(tableBodyCls);
31
+ const tableBodyRect = tableBody?.getBoundingClientRect();
32
+ const tableFooter = ref.current?.querySelector?.(tableFooterCls);
33
+ const tableFooterRect = tableFooter?.getBoundingClientRect();
34
+ const tablePagination = ref.current?.querySelector?.(tablePaginationCls);
35
+ const tablePaginationRect = tablePagination?.getBoundingClientRect();
36
+ const tableFooterHeight = tableFooterRect?.height || 0;
37
+ const tablePaginationMargin = 16;
38
+ const tablePaginationHeight = tablePaginationRect?.height || 0;
39
+ const border = 2;
40
+ const margin = 20;
41
+ const scrollY = window.innerHeight - tableBodyRect.top - tableFooterHeight - tablePaginationHeight - tablePaginationMargin - border - margin;
42
+ return scrollY;
43
+ };
44
+ const debouncedCalcScrollY = useCallback(() => {
45
+ if (timerRef.current) {
46
+ clearTimeout(timerRef.current);
39
47
  }
40
- return () => {
41
- if (mutationObserver && resizeObserver && enabledResizer) {
42
- resizeObserver.unobserve(document.body);
43
- mutationObserver.disconnect(document.body);
48
+ timerRef.current = setTimeout(() => {
49
+ const height = calcTableScrollY();
50
+ if (height) {
51
+ setScrollY(height);
44
52
  }
45
- };
53
+ }, 150);
46
54
  }, []);
47
- React.useEffect(() => {
48
- setTableSize(size, storeIndex);
49
- }, [size]);
55
+ useEffect(() => {
56
+ if (!ref.current || !enableAutoScrollY) return;
57
+
58
+ // 创建 ResizeObserver 监听元素尺寸变化
59
+ const resizeObserver = new ResizeObserver(() => {
60
+ // 等待 table-pagination 元素生成后再计算
61
+ debouncedCalcScrollY();
62
+ });
63
+ const mutationObserver = new MutationObserver(() => {
64
+ debouncedCalcScrollY();
65
+ });
66
+ mutationObserver.observe(ref.current, {
67
+ childList: true,
68
+ subtree: true,
69
+ attributes: true
70
+ });
50
71
 
51
- // 计算高度
52
- const calcTableHeight = () => {
53
- try {
54
- // table元素
55
- const tableEl = document.querySelector(tableCls);
56
- // table-body元素
57
- const tableBodyEl = document.querySelector(tableBodyCls);
58
- if (tableBodyEl && tableEl) {
59
- // 获取table元素的矩形数据
60
- const tableRect = tableEl.getBoundingClientRect();
61
- // 获取table-body元素的矩形数据
62
- const tableBodyRect = tableBodyEl.getBoundingClientRect();
63
- // 获取底部的高度差
64
- const bottomHeight = tableRect.bottom - tableBodyRect.bottom;
65
- // 计算最终值
66
- setTableHeight(innerHeight - tableBodyRect.top - bottomHeight - (window.__IN_BASE__ ? 38 : 22));
72
+ // 开始观察 ref.current 的尺寸变化
73
+ resizeObserver.observe(ref.current);
74
+ return () => {
75
+ if (timerRef.current) {
76
+ clearTimeout(timerRef.current);
67
77
  }
68
- } catch (e) {
69
- window.console['error'](e);
70
- }
71
- };
72
- const {
73
- components,
74
- resizableColumns,
75
- tableWidth,
76
- resetColumns
77
- // refresh
78
- } = useAntdResizableHeader({
79
- columns: props.columns,
80
- columnsState: {
81
- persistenceKey: persistenceKey.resizable,
82
- persistenceType: 'localStorage'
78
+ resizeObserver.disconnect();
79
+ mutationObserver.disconnect();
80
+ };
81
+ }, [ref, enableAutoScrollY, debouncedCalcScrollY]);
82
+ return /*#__PURE__*/React.createElement("div", {
83
+ ref: ref,
84
+ style: {
85
+ height: '100%'
83
86
  }
84
- });
85
- const scroll = {
86
- x: tableWidth
87
- };
88
- if (enabledResizer) {
89
- scroll.y = tableHeight;
90
- }
91
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ProTable, _extends({
87
+ }, /*#__PURE__*/React.createElement(ProTable, _extends({
92
88
  ghost: true,
93
89
  columnEmptyText: true,
94
- size: size,
95
90
  search: false,
96
- scroll: scroll,
91
+ scroll: enableAutoScrollY ? {
92
+ y: scrollY || 0
93
+ } : undefined,
97
94
  className: `${antPrefix}-gbs-pro-table`,
98
- options: {
99
- reload: false,
100
- fullScreen: true,
101
- setting: {
102
- checkedReset: true,
103
- extra: /*#__PURE__*/React.createElement("a", {
104
- className: `${antPrefix}-pro-table-column-setting-action-rest-button`,
105
- onClick: resetColumns
106
- }, "\u91CD\u7F6E\u5217\u5BBD")
107
- }
108
- },
109
- components: components,
110
- columnsState: {
111
- persistenceKey: persistenceKey.columnState,
112
- persistenceType: 'localStorage'
113
- },
114
- onSizeChange: setSize
115
- }, props, {
116
- columns: resizableColumns
95
+ size: "default",
96
+ options: options
97
+ }, restProps, {
98
+ columns: restProps.columns
117
99
  })));
118
100
  }
package/Table/index.less CHANGED
@@ -1,8 +1,10 @@
1
- .@{ant-prefix} {
1
+ @com-prefix-cls: if(isdefined(@ant-prefix), @ant-prefix, ant);
2
+
3
+ .@{com-prefix-cls} {
2
4
  &-gbs-pro-table {
3
- .@{ant-prefix}-pro-card {
5
+ .@{com-prefix-cls}-pro-card {
4
6
  &-body {
5
- .@{ant-prefix}-pro-table-list-toolbar {
7
+ .@{com-prefix-cls}-pro-table-list-toolbar {
6
8
  &-container {
7
9
  padding-top: 0;
8
10
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cqsjjb/jjb-react-admin-component",
3
- "version": "3.3.1-beta.8",
3
+ "version": "3.3.2",
4
4
  "description": "jjb-react-admin-组件库@new",
5
5
  "main": "index.js",
6
6
  "author": "jjb-front-team",
@@ -1,38 +0,0 @@
1
- @com-prefix-cls: if(isdefined(@ant-prefix), @ant-prefix, ant);
2
-
3
- .@{com-prefix-cls}-form-item-control-label-wrapper {
4
- .@{com-prefix-cls}-form-item-control-label-span {
5
- border: 1px solid #d9d9d9;
6
- height: 32px;
7
- line-height: 30px;
8
- box-sizing: border-box;
9
- margin-right: -1px;
10
- padding: 0 2px 0 8px;
11
- border-top-left-radius: 4px;
12
- border-bottom-left-radius: 4px;
13
- white-space: nowrap;
14
- }
15
-
16
- &.@{com-prefix-cls}-form-item-control-label-has {
17
- .@{com-prefix-cls}-select-selector, .@{com-prefix-cls}-picker, .@{com-prefix-cls}-input, .@{com-prefix-cls}-input-affix-wrapper {
18
- border-top-left-radius: 0;
19
- border-bottom-left-radius: 0;
20
- border-left-color: transparent !important;
21
- &:hover, &:focus, &:focus-within{
22
- border-left-color: @colorPrimary !important;
23
- }
24
- }
25
- }
26
-
27
- &-default {
28
- .@{com-prefix-cls}-form-item-control-label-span {
29
- border-color: #d9d9d9;
30
- }
31
- }
32
-
33
- &-dark {
34
- .@{com-prefix-cls}-form-item-control-label-span {
35
- border-color: #424242;
36
- }
37
- }
38
- }