@gmfe/table-x 2.14.30-alpha.0 → 2.15.4-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +5 -5
  2. package/src/hoc/sticky_layout.js +0 -149
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gmfe/table-x",
3
- "version": "2.14.30-alpha.0",
3
+ "version": "2.15.4-alpha.0",
4
4
  "description": "",
5
5
  "author": "liyatang <liyatang@qq.com>",
6
6
  "homepage": "https://github.com/gmfe/gmfe#readme",
@@ -27,9 +27,9 @@
27
27
  },
28
28
  "dependencies": {
29
29
  "@gm-common/tool": "^1.0.0",
30
- "@gmfe/business": "^2.14.30-alpha.0",
31
- "@gmfe/locales": "^2.14.30-alpha.0",
32
- "@gmfe/react": "^2.14.30-alpha.0",
30
+ "@gmfe/business": "^2.15.4-alpha.0",
31
+ "@gmfe/locales": "^2.15.4-alpha.0",
32
+ "@gmfe/react": "^2.15.4-alpha.0",
33
33
  "classnames": "^2.2.5",
34
34
  "lodash": "^4.17.14",
35
35
  "prop-types": "^15.7.2",
@@ -37,5 +37,5 @@
37
37
  "react-window": "^1.8.5",
38
38
  "sortablejs": "^1.10.1"
39
39
  },
40
- "gitHead": "f7da14010d37550f0a19949fe4a5b3d65301545a"
40
+ "gitHead": "2c13925c3699572748de29cf0256ca1431c30f01"
41
41
  }
package/src/hoc/sticky_layout.js DELETED
@@ -1,149 +0,0 @@
1
- /**
2
- * @author: stanfer
3
- * @description:
4
- * @createDate: 2025/11/24 11:05
5
- * @Version: 1.0
6
- * @last modify time:
7
- **/
8
- import React, { useRef, useEffect } from 'react'
9
-
10
- function stickyLayout(Component) {
11
- const StickyLayout = ({ ...rest }) => {
12
- const currentStickyRef = useRef(null);
13
- const topSentinelRef = useRef(null);
14
- const bottomSentinelRef = useRef(null);
15
- // 统一管理
16
- const observerRef = useRef(null);
17
-
18
- useEffect(() => {
19
- if (!currentStickyRef.current) return;
20
-
21
- const options = {
22
- root: null, // 相对于浏览器视口
23
- rootMargin: '0px',
24
- threshold: 0, // 只要有一个像素进入/离开视口就触发
25
- };
26
-
27
- observerRef.current = new IntersectionObserver((entries) => {
28
- entries.forEach((entry) => {
29
- const target = entry.target;
30
-
31
- if (target === topSentinelRef.current) {
32
- if (entry.isIntersecting) {
33
- console.log('=======> 顶部进入');
34
- let heightSum = 0, tableRoot;
35
- const fullTab = document.querySelectorAll('.gm-framework-full-tabs')
36
- const commonStickyHeader = document.querySelectorAll('.common-sticky-header')
37
- const rtTable = document.querySelectorAll('.rt-table')
38
- const rtTheadHeader = document.querySelectorAll('.rt-thead')
39
- rtTheadHeader.forEach((el) => {
40
- el.style.position = 'sticky';
41
- el.style.top = 0;
42
- el.style.zIndex = 10;
43
- heightSum += el.offsetHeight + 10; // 元素本身高 + 上下 10 padding
44
- })
45
-
46
- commonStickyHeader.forEach((item, idx) => {
47
- if (fullTab.length) {
48
- currentStickyRef.current.style.zIndex = 101;
49
- }
50
- // console.log(item.className);
51
- if (item.className.includes('gm-box-table-header')) {
52
- heightSum += item.offsetHeight + 10; // 元素本身高 + 上下 10 padding
53
- // console.log(idx, item.getBoundingClientRect(), 'gm-box-table-header: ', item.getBoundingClientRect().height + 20);
54
- }
55
- if (item.className.includes('gm-table-x-thead')) {
56
- heightSum += item.offsetHeight + 8; // 元素本身高 + 上下 8 padding
57
- tableRoot = item.parentElement.parentElement;
58
- // console.log(idx, item.getBoundingClientRect(), 'gm-table-x-thead: ', item.getBoundingClientRect().height + 16);
59
- }
60
- })
61
-
62
- if (rtTable.length) {
63
- rtTable.forEach((el) => {
64
- if (fullTab.length) {
65
- el.style.maxHeight = `calc(100vh - ${heightSum + (fullTab.length * 40) + 50}px)`; // +50 顶部导航栏
66
- return;
67
- }
68
- el.style.maxHeight = `calc(100vh - ${heightSum + 50}px)`; // +50 顶部导航栏
69
- })
70
- }
71
- if (tableRoot) {
72
- if (fullTab.length) {
73
- tableRoot.style.maxHeight = `calc(100vh - ${heightSum + (fullTab.length * 40) + 50}px)`; // +50 顶部导航栏
74
- return;
75
- }
76
- tableRoot.style.maxHeight = `calc(100vh - ${heightSum + 50}px)`; // +50 顶部导航栏
77
- }
78
- // currentStickyRef.current.style.maxHeight = 'unset';
79
- console.log('currentStickyRef 实例:', currentStickyRef.current.style);
80
- return
81
- }
82
- currentStickyRef.current.style.maxHeight = '50%'; // TODO: 这块需要之后要走外部参数
83
- console.log('顶部离开 <========');
84
- return;
85
- }
86
- if (target === bottomSentinelRef.current) {
87
- if (entry.isIntersecting) {
88
- console.log('=======> 底部进入');
89
- return;
90
- }
91
- console.log('底部离开 <========');
92
- }
93
- });
94
- }, options);
95
-
96
- if (topSentinelRef.current) {
97
- observerRef.current.observe(topSentinelRef.current);
98
- }
99
- if (bottomSentinelRef.current) {
100
- observerRef.current.observe(bottomSentinelRef.current);
101
- }
102
-
103
- return () => {
104
- if (observerRef.current) {
105
- observerRef.current.disconnect();
106
- }
107
- };
108
- }, [])
109
-
110
- return (
111
- <div ref={currentStickyRef} className='common-sticky-layout'>
112
- <div
113
- ref={topSentinelRef}
114
- sentinel="topSentinel"
115
- style={{
116
- position: 'absolute',
117
- top: '0',
118
- left: '0',
119
- width: '100%',
120
- height: '1px', // 尽量小，不占空间
121
- pointerEvents: 'none', // 防止它拦截任何鼠标事件
122
- backgroundColor: 'transparent', // 完全透明
123
- }}
124
- />
125
- <Component {...rest} />
126
- <div
127
- ref={bottomSentinelRef}
128
- sentinel="bottomSentinel"
129
- style={{
130
- position: 'absolute',
131
- bottom: '0',
132
- left: '0',
133
- width: '100%',
134
- height: '1px',
135
- pointerEvents: 'none',
136
- backgroundColor: 'transparent',
137
- }}
138
- />
139
- </div>
140
- )
141
- }
142
-
143
- StickyLayout.propTypes = StickyLayout.propTypes;
144
- StickyLayout.defaultProps = StickyLayout.defaultProps;
145
-
146
- return StickyLayout
147
- }
148
-
149
- export default stickyLayout