@conecli/cone-render 0.10.1-shop3.5 → 0.10.1-shop3.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/common/accessibility.h5.ts +1 -0
- package/dist/common/accessibility.ts +0 -0
- package/dist/common/const.ts +1 -1
- package/dist/common/index.h5.ts +1 -1
- package/dist/common/index.jd.ts +1 -1
- package/dist/common/index.ts +1 -1
- package/dist/common/index.weapp.ts +1 -1
- package/dist/common/jdplayerSdk.weapp.tsx +1 -0
- package/dist/common/jssdk.ts +1 -1
- package/dist/common/jssdk.weapp.ts +1 -0
- package/dist/common/pageType.ts +1 -1
- package/dist/common/token/index.h5.ts +1 -1
- package/dist/common/token/token.jd.ts +1 -1
- package/dist/common/wxappApi.ts +1 -1
- package/dist/components/ErrorBoundary.tsx +1 -1
- package/dist/components/base/CommonFloorHead/index.module.scss +126 -111
- package/dist/components/base/CommonFloorHead/index.tsx +1 -1
- package/dist/components/base/CountDown/index.tsx +1 -1
- package/dist/components/base/CustomScrollView/index-back.tsx +1 -0
- package/dist/components/base/CustomScrollView/index.tsx +1 -1
- package/dist/components/base/CustomVideo/index.tsx +1 -1
- package/dist/components/base/CustomVideo/index.weapp.tsx +1 -0
- package/dist/components/base/Dialog/index.module.scss +11 -0
- package/dist/components/base/InOrOutViewObserver/index.weapp.tsx +1 -0
- package/dist/components/base/InViewRender/index.tsx +1 -1
- package/dist/components/base/ItemViewExposureSmart/index.tsx +1 -1
- package/dist/components/base/LazyLayoutLoad/index.tsx +1 -1
- package/dist/components/base/MobileCommonHeader/index.weapp.tsx +1 -0
- package/dist/components/base/NetworkDataError/const.ts +1 -1
- package/dist/components/base/NetworkDataError/index.module.scss +118 -72
- package/dist/components/base/NetworkDataError/index.tsx +1 -1
- package/dist/components/base/Price/Base/index.module.scss +12 -0
- package/dist/components/base/Price/Base/index.tsx +1 -1
- package/dist/components/base/Price/Double/index.module.scss +24 -0
- package/dist/components/base/Price/Double/index.tsx +1 -1
- package/dist/components/debug/DebugLayout/index.module.scss +2 -2
- package/dist/components/floorItem.weapp.tsx +1 -1
- package/dist/interface/common.ts +1 -1
- package/dist/interface/component.ts +1 -1
- package/dist/interface/jumpEventReport.ts +1 -1
- package/dist/jumpEventReport/base.ts +1 -1
- package/dist/jumpEventReport/const.ts +1 -1
- package/dist/jumpEventReport/createReportFloorData.ts +1 -1
- package/dist/jumpEventReport/index.h5.ts +1 -1
- package/dist/jumpEventReport/index.jd.ts +1 -1
- package/dist/jumpEventReport/index.weapp.ts +1 -1
- package/dist/jumpEventReport/jdJumpJdApp.ts +1 -1
- package/dist/jumpEventReport/jumpUrlConfig/base.ts +1 -1
- package/dist/jumpEventReport/logEventConfig.h5.ts +1 -0
- package/dist/jumpEventReport/logEventConfig.ts +1 -1
- package/dist/jumpEventReport/web/report.ts +1 -1
- package/dist/jumpEventReport/web.base.ts +1 -1
- package/dist/jumpEventReport/web.jd.ts +1 -1
- package/dist/jumpEventReport/web.pc.ts +1 -1
- package/dist/jumpEventReport/web.tjm.ts +1 -1
- package/dist/jumpEventReport/web.wxapp.ts +1 -1
- package/dist/language/en_US.json +231 -0
- package/dist/language/zh_CN.json +231 -0
- package/dist/language/zh_HK.json +231 -0
- package/dist/libs/taroAppReport.js +2 -2
- package/dist/modules/ContainerFloorList/index.h5.module.scss +66 -56
- package/dist/modules/ContainerFloorList/index.h5.tsx +1 -1
- package/dist/modules/ContainerFloorList/index.tsx +1 -1
- package/dist/modules/DecorateContainerFloorList/index.weapp.tsx +1 -0
- package/dist/open/api/environment.ts +1 -1
- package/dist/open/api/shopMember.ts +1 -1
- package/dist/open/api/shopMember.weapp.ts +1 -0
- package/dist/open/api/util.ts +1 -1
- package/dist/open/index.ts +1 -1
- package/dist/sass/app.h5.scss +278 -224
- package/dist/service/fetchGateway.ts +1 -1
- package/dist/service/fetchGateway.weapp.ts +1 -0
- package/dist/service/fetchJsonp.weapp.ts +1 -0
- package/dist/service/http/colorSign.ts +1 -1
- package/dist/service/http/const.ts +1 -1
- package/dist/service/http/h5Http.ts +1 -1
- package/dist/service/http/httpInterceptors.weapp.ts +1 -0
- package/dist/service/requestServer.h5.ts +1 -1
- package/dist/service/requestServer.ts +1 -1
- package/dist/service/requestServer.weapp.ts +1 -0
- package/dist/utils/connectNativeJsBridge.ts +1 -1
- package/dist/utils/h5Utils.ts +1 -1
- package/dist/utils/harmonyCallRouter.h5.ts +1 -0
- package/dist/utils/harmonyCallRouter.ts +0 -0
- package/dist/utils/index.h5.ts +1 -1
- package/dist/utils/index.ts +1 -1
- package/dist/utils/index.weapp.ts +1 -1
- package/dist/utils/jumpExtMapUtil.h5.ts +1 -0
- package/dist/utils/jumpExtMapUtil.ts +1 -0
- package/dist/utils/log.ts +1 -0
- package/dist/utils/{sColor.js → sColor.ts} +1 -1
- package/dist/utils/sColor.weapp.ts +1 -0
- package/dist/utils/utils.ts +1 -1
- package/dist/wxapp/common/address_api/address_api_v2.js +1 -0
- package/dist/wxapp/common/user_info.js +1 -1
- package/package.json +160 -141
- package/dist/jumpEventReport/web/wqshop.report.ts +0 -1
- package/dist/utils/priceUtils.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import Taro from '@tarojs/taro'
|
|
2
1
|
getNativePageScrollRes,
|
|
3
2
|
latestFromNativeMsgStorage,
|
|
4
3
|
const { children, placeholder, height, className, inViewCallback } = props
|
|
5
4
|
const [componentShowState, setComponentShowState] = useState(false)
|
|
6
5
|
const [componentRenderShowState, setComponentRenderShowState] = useState(
|
|
7
6
|
false,
|
|
8
7
|
)
|
|
9
8
|
const componentLazyRef = useRef<HTMLElement | null>(null)
|
|
10
9
|
const componentShowStateRef = useRef(false)
|
|
11
10
|
const needShowHighVersion =
|
|
12
11
|
isH5AndJdShopViewH5Scroll &&
|
|
13
12
|
!(
|
|
14
13
|
global.info.queryInfo?.downgraded &&
|
|
15
14
|
global.info.queryInfo.downgraded === 'true'
|
|
16
15
|
)
|
|
17
16
|
const rootDom =
|
|
18
17
|
isH5AndJdShopView && needShowHighVersion
|
|
19
18
|
? null
|
|
20
19
|
: document.querySelector('#J_shopHomeRoot')
|
|
21
20
|
if (isH5AndJdShopView && !needShowHighVersion && !isAppStowShop) {
|
|
22
21
|
useEffect(() => {
|
|
23
22
|
const latestRes =
|
|
24
23
|
latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
|
|
25
24
|
!componentShowStateRef.current && dealPageScrollInfo(latestRes)
|
|
26
25
|
Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, res => {
|
|
27
26
|
!componentShowStateRef.current && dealPageScrollInfo(res)
|
|
28
27
|
})
|
|
29
28
|
}, [])
|
|
30
29
|
useEffect(() => {
|
|
31
30
|
if (componentShowState) {
|
|
32
31
|
typeof inViewCallback === 'function' && inViewCallback()
|
|
33
32
|
}
|
|
34
33
|
}, [componentShowState])
|
|
35
34
|
|
|
36
35
|
const dealPageScrollInfo = res => {
|
|
37
36
|
const { displayHeight, offSetY } = getNativePageScrollRes(res) || {}
|
|
38
37
|
if (
|
|
39
38
|
typeof displayHeight === 'undefined' ||
|
|
40
39
|
typeof offSetY === 'undefined'
|
|
41
40
|
)
|
|
42
41
|
return
|
|
43
42
|
if (componentLazyRef.current) {
|
|
44
43
|
const eleClientRect = componentLazyRef.current.getBoundingClientRect()
|
|
45
44
|
const getContainerHeightOffSetY = displayHeight + offSetY
|
|
46
45
|
const eleOffsetTop = Math.ceil(eleClientRect.top)
|
|
47
46
|
if (!componentShowStateRef.current) {
|
|
48
47
|
if (getContainerHeightOffSetY > eleOffsetTop) {
|
|
49
48
|
componentShowStateRef.current = true
|
|
50
49
|
setComponentShowState(true)
|
|
51
50
|
Taro.nextTick(() => {
|
|
52
51
|
setComponentRenderShowState(true)
|
|
53
52
|
})
|
|
54
53
|
}
|
|
55
54
|
}
|
|
56
55
|
}
|
|
57
56
|
}
|
|
58
57
|
return (
|
|
59
58
|
<View
|
|
60
59
|
ref={componentLazyRef}
|
|
61
60
|
className={classNames(
|
|
62
61
|
lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
|
|
63
62
|
'd-app-floor-lazy-load',
|
|
64
63
|
className,
|
|
65
64
|
)}
|
|
66
65
|
style={{
|
|
67
66
|
minHeight: `${
|
|
68
67
|
componentRenderShowState
|
|
69
68
|
? 'auto'
|
|
70
69
|
: height + (typeof height === 'number' ? 'px' : '')
|
|
71
70
|
}`,
|
|
72
71
|
backgroundColor: componentRenderShowState ? 'transparent' : '#ffffff',
|
|
73
72
|
}}
|
|
74
73
|
>
|
|
75
74
|
{componentShowState ? children : placeholder}
|
|
76
75
|
</View>
|
|
77
76
|
)
|
|
78
77
|
} else {
|
|
79
78
|
const { ref, inView } = useInView({
|
|
80
79
|
threshold: 0.5,
|
|
81
80
|
triggerOnce: true,
|
|
82
81
|
root: rootDom || null,
|
|
83
82
|
rootMargin: `0px 0px 0px 0px`,
|
|
84
83
|
delay: 300,
|
|
85
84
|
})
|
|
86
85
|
useEffect(() => {
|
|
87
86
|
if (inView) {
|
|
88
87
|
typeof inViewCallback === 'function' && inViewCallback()
|
|
89
88
|
}
|
|
90
89
|
}, [inView])
|
|
91
90
|
return (
|
|
92
91
|
<View
|
|
93
92
|
className={className}
|
|
94
93
|
ref={ref}
|
|
95
94
|
style={{
|
|
96
95
|
minHeight: inView
|
|
97
96
|
? 'auto'
|
|
98
97
|
: typeof height === 'number'
|
|
99
98
|
? `${height}px`
|
|
100
99
|
: height,
|
|
101
100
|
backgroundColor: 'transparent',
|
|
102
101
|
}}
|
|
103
102
|
>
|
|
104
103
|
{inView ? children : placeholder}
|
|
105
104
|
</View>
|
|
106
105
|
)
|
|
107
106
|
}
|
|
108
107
|
children: null,
|
|
109
108
|
placeholder: null,
|
|
110
109
|
height: 1,
|
|
111
110
|
className: '',
|
|
112
111
|
lazyNodeClassName: '',
|
|
113
112
|
inViewCallback: null,
|
|
113
|
+
import Taro from '@tarojs/taro';
|
|
114
114
|
getNativePageScrollRes,
|
|
115
115
|
latestFromNativeMsgStorage,
|
|
116
116
|
const { children, placeholder, height, className, inViewCallback } = props;
|
|
117
117
|
const [componentShowState, setComponentShowState] = useState(false);
|
|
118
118
|
const [componentRenderShowState, setComponentRenderShowState] = useState(false);
|
|
119
119
|
const componentLazyRef = useRef<HTMLElement | null>(null);
|
|
120
120
|
const componentShowStateRef = useRef(false);
|
|
121
121
|
const needShowHighVersion =
|
|
122
122
|
isH5AndJdShopViewH5Scroll &&
|
|
123
123
|
!(global.info.queryInfo?.downgraded && global.info.queryInfo.downgraded === 'true');
|
|
124
124
|
const rootDom =
|
|
125
125
|
isH5AndJdShopView && needShowHighVersion ? null : document.querySelector('#J_shopHomeRoot');
|
|
126
126
|
if (isH5AndJdShopView && !needShowHighVersion && !isAppStowShop) {
|
|
127
127
|
useEffect(() => {
|
|
128
128
|
const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {};
|
|
129
129
|
!componentShowStateRef.current && dealPageScrollInfo(latestRes);
|
|
130
130
|
Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
|
|
131
131
|
!componentShowStateRef.current && dealPageScrollInfo(res);
|
|
132
132
|
});
|
|
133
133
|
}, []);
|
|
134
134
|
useEffect(() => {
|
|
135
135
|
if (componentShowState) {
|
|
136
136
|
typeof inViewCallback === 'function' && inViewCallback();
|
|
137
137
|
}
|
|
138
138
|
}, [componentShowState]);
|
|
139
139
|
|
|
140
140
|
const dealPageScrollInfo = (res) => {
|
|
141
141
|
const { displayHeight, offSetY } = getNativePageScrollRes(res) || {};
|
|
142
142
|
if (typeof displayHeight === 'undefined' || typeof offSetY === 'undefined') return;
|
|
143
143
|
if (componentLazyRef.current) {
|
|
144
144
|
const eleClientRect = componentLazyRef.current.getBoundingClientRect();
|
|
145
145
|
const getContainerHeightOffSetY = displayHeight + offSetY;
|
|
146
146
|
const eleOffsetTop = Math.ceil(eleClientRect.top);
|
|
147
147
|
if (!componentShowStateRef.current) {
|
|
148
148
|
if (getContainerHeightOffSetY > eleOffsetTop) {
|
|
149
149
|
componentShowStateRef.current = true;
|
|
150
150
|
setComponentShowState(true);
|
|
151
151
|
Taro.nextTick(() => {
|
|
152
152
|
setComponentRenderShowState(true);
|
|
153
153
|
});
|
|
154
154
|
}
|
|
155
155
|
}
|
|
156
156
|
}
|
|
157
157
|
};
|
|
158
158
|
return (
|
|
159
159
|
<View
|
|
160
160
|
ref={componentLazyRef}
|
|
161
161
|
className={classNames(
|
|
162
162
|
lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
|
|
163
163
|
'd-app-floor-lazy-load',
|
|
164
164
|
className,
|
|
165
165
|
)}
|
|
166
166
|
style={{
|
|
167
167
|
minHeight: `${
|
|
168
168
|
componentRenderShowState ? 'auto' : height + (typeof height === 'number' ? 'px' : '')
|
|
169
169
|
}`,
|
|
170
170
|
backgroundColor: componentRenderShowState ? 'transparent' : '#ffffff',
|
|
171
171
|
}}
|
|
172
172
|
>
|
|
173
173
|
{componentShowState ? children : placeholder}
|
|
174
174
|
</View>
|
|
175
175
|
);
|
|
176
176
|
} else {
|
|
177
177
|
const { ref, inView } = useInView({
|
|
178
178
|
threshold: 0.5,
|
|
179
179
|
triggerOnce: true,
|
|
180
180
|
root: rootDom || null,
|
|
181
181
|
rootMargin: `0px 0px 0px 0px`,
|
|
182
182
|
delay: 300,
|
|
183
183
|
});
|
|
184
184
|
useEffect(() => {
|
|
185
185
|
if (inView) {
|
|
186
186
|
typeof inViewCallback === 'function' && inViewCallback();
|
|
187
187
|
}
|
|
188
188
|
}, [inView]);
|
|
189
189
|
return (
|
|
190
190
|
<div
|
|
191
191
|
className={className}
|
|
192
192
|
ref={ref}
|
|
193
193
|
style={{
|
|
194
194
|
minHeight: inView ? 'auto' : typeof height === 'number' ? `${height}px` : height,
|
|
195
195
|
backgroundColor: 'transparent',
|
|
196
196
|
}}
|
|
197
197
|
>
|
|
198
198
|
{inView ? children : placeholder}
|
|
199
199
|
</div>
|
|
200
200
|
);
|
|
201
201
|
}
|
|
202
202
|
children: null,
|
|
203
203
|
placeholder: null,
|
|
204
204
|
height: 1,
|
|
205
205
|
className: '',
|
|
206
206
|
lazyNodeClassName: '',
|
|
207
207
|
inViewCallback: null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import React, { useRef } from 'react';
|
|
2
1
|
const {
|
|
3
2
|
className,
|
|
4
3
|
pointClassName,
|
|
5
4
|
children,
|
|
6
5
|
reportData,
|
|
7
6
|
customReportDataKey,
|
|
8
7
|
customReportDataFn,
|
|
9
8
|
trackCallback,
|
|
10
9
|
...otherProps
|
|
11
10
|
} = props;
|
|
12
11
|
const itemViewExposureRef = useRef(null);
|
|
13
12
|
const isCustomReport = customReportDataKey && customReportDataFn;
|
|
14
13
|
const checkReportData = Array.isArray(reportData);
|
|
15
14
|
const [floorData, mInfo] = checkReportData ? reportData : [];
|
|
16
15
|
const checkReportDataState = isCustomReport ? true : floorData && mInfo;
|
|
17
16
|
|
|
18
17
|
floorData && mInfo && !mInfo.hasOwnProperty('pos') && (mInfo.pos = 0);
|
|
19
18
|
return (
|
|
20
19
|
<View
|
|
21
20
|
ref={itemViewExposureRef}
|
|
22
21
|
className={classNames(itemViewExposureSmartStyle['d-item-point-layout'], className)}
|
|
23
22
|
{...otherProps}
|
|
24
23
|
>
|
|
25
24
|
{children ? children : null}
|
|
26
25
|
{checkReportDataState && (
|
|
27
26
|
<ExposureSmart
|
|
28
27
|
className={classNames(pointClassName, {
|
|
29
28
|
[itemViewExposureSmartStyle['d-item-chart-point']]: isChartH5,
|
|
30
29
|
})}
|
|
31
30
|
innerRef={itemViewExposureRef}
|
|
32
31
|
reportData={reportData}
|
|
33
32
|
trackCallback={trackCallback}
|
|
34
33
|
customReportDataFn={customReportDataFn}
|
|
35
34
|
customReportDataKey={customReportDataKey}
|
|
36
35
|
markPoint
|
|
37
36
|
/>
|
|
38
37
|
)}
|
|
39
38
|
</View>
|
|
40
39
|
);
|
|
41
40
|
reportData: [],
|
|
42
41
|
customReportDataKey: null,
|
|
43
42
|
customReportDataFn: null,
|
|
44
43
|
customReportDataForMapFn: null,
|
|
44
|
+
import React, { useRef, useEffect } from 'react';
|
|
45
45
|
const {
|
|
46
46
|
className,
|
|
47
47
|
pointClassName,
|
|
48
48
|
children,
|
|
49
49
|
reportData,
|
|
50
50
|
customReportDataKey,
|
|
51
51
|
customReportDataFn,
|
|
52
52
|
trackCallback,
|
|
53
53
|
...otherProps
|
|
54
54
|
} = props;
|
|
55
55
|
const itemViewExposureRef = useRef(null);
|
|
56
56
|
const isCustomReport = customReportDataKey && customReportDataFn;
|
|
57
57
|
const checkReportData = Array.isArray(reportData);
|
|
58
58
|
const [floorData, mInfo] = checkReportData ? reportData : [];
|
|
59
59
|
const checkReportDataState = isCustomReport ? true : floorData && mInfo;
|
|
60
60
|
|
|
61
61
|
floorData && mInfo && !mInfo.hasOwnProperty('pos') && (mInfo.pos = 0);
|
|
62
62
|
return (
|
|
63
63
|
<View
|
|
64
64
|
ref={itemViewExposureRef}
|
|
65
65
|
className={classNames(itemViewExposureSmartStyle['d-item-point-layout'], className)}
|
|
66
66
|
{...otherProps}
|
|
67
67
|
>
|
|
68
68
|
{children ? children : null}
|
|
69
69
|
{checkReportDataState && (
|
|
70
70
|
<ExposureSmart
|
|
71
71
|
className={classNames(pointClassName, {
|
|
72
72
|
[itemViewExposureSmartStyle['d-item-chart-point']]: isChartH5,
|
|
73
73
|
})}
|
|
74
74
|
innerRef={itemViewExposureRef}
|
|
75
75
|
reportData={reportData}
|
|
76
76
|
trackCallback={trackCallback}
|
|
77
77
|
customReportDataFn={customReportDataFn}
|
|
78
78
|
customReportDataKey={customReportDataKey}
|
|
79
79
|
markPoint
|
|
80
80
|
/>
|
|
81
81
|
)}
|
|
82
82
|
</View>
|
|
83
83
|
);
|
|
84
84
|
reportData: [],
|
|
85
85
|
customReportDataKey: null,
|
|
86
86
|
customReportDataFn: null,
|
|
87
87
|
customReportDataForMapFn: null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import Taro, { useRouter } from '@tarojs/taro'
|
|
2
1
|
isH5AndJdShopView,
|
|
3
2
|
isH5AndJdShopViewH5Scroll,
|
|
4
3
|
sgmCustomReport,
|
|
5
4
|
getSgmCustomCode,
|
|
6
5
|
SECTION_HOME_TAB_TYPE,
|
|
7
6
|
SECTION_HOME_TAB_NAME_TYPE,
|
|
8
7
|
TaroEventType,
|
|
9
8
|
latestFromNativeMsgStorage,
|
|
10
9
|
nativePageRegisterMessage,
|
|
11
10
|
Message_Type,
|
|
12
11
|
getNativePageScrollRes,
|
|
13
12
|
const {
|
|
14
13
|
sectionType = SECTION_HOME_TAB_NAME_TYPE[
|
|
15
14
|
SECTION_HOME_TAB_TYPE.HOME_WELL_CHOSEN
|
|
16
15
|
],
|
|
17
16
|
type = LazyType.FLOOR,
|
|
18
17
|
children = null,
|
|
19
18
|
placeholder = null,
|
|
20
19
|
height = 200,
|
|
21
20
|
className = '',
|
|
22
21
|
lazyNodeClassName = '',
|
|
23
22
|
containerId,
|
|
24
23
|
floorData = {},
|
|
25
24
|
} = props
|
|
26
25
|
const getRouterInfo = useRouter()
|
|
27
26
|
const getQueryData = getRouterInfo?.params || {}
|
|
28
27
|
const [componentShowState, setComponentShowState] = useState(false)
|
|
29
28
|
const [componentRenderShowState, setComponentRenderShowState] =
|
|
30
29
|
useState(false)
|
|
31
30
|
const componentLazyRef = useRef<HTMLElement | null>(null)
|
|
32
31
|
const componentShowStateRef = useRef(false)
|
|
33
32
|
const needShowHighVersion =
|
|
34
33
|
isH5AndJdShopViewH5Scroll &&
|
|
35
34
|
!(
|
|
36
35
|
global.info.queryInfo?.downgraded &&
|
|
37
36
|
global.info.queryInfo.downgraded === 'true'
|
|
38
37
|
)
|
|
39
38
|
const rootDom =
|
|
40
39
|
isH5AndJdShopView && needShowHighVersion
|
|
41
40
|
? null
|
|
42
41
|
: document.querySelector('#J_shopHomeRoot')
|
|
43
42
|
const { ref, inView } = useInView({
|
|
44
43
|
threshold: 0,
|
|
45
44
|
triggerOnce: true,
|
|
46
45
|
root: rootDom,
|
|
47
46
|
rootMargin: `0px 0px ${window.innerHeight}px 0px`,
|
|
48
47
|
})
|
|
49
48
|
useEffect(() => {
|
|
50
49
|
if (needShowHighVersion || !isH5AndJdShopView) return
|
|
51
50
|
if (type === LazyType.FLOOR) {
|
|
52
51
|
const latestRes =
|
|
53
52
|
latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
|
|
54
53
|
!componentShowStateRef.current && dealPageScrollInfo(latestRes, false)
|
|
55
54
|
Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
|
|
56
55
|
!componentShowStateRef.current && dealPageScrollInfo(res, true)
|
|
57
56
|
})
|
|
58
57
|
}
|
|
59
58
|
}, [])
|
|
60
59
|
useEffect(() => {
|
|
61
60
|
if (
|
|
62
61
|
(!needShowHighVersion && componentShowState === true) ||
|
|
63
62
|
(needShowHighVersion && inView && isH5AndJdShopView)
|
|
64
63
|
) {
|
|
65
64
|
console.log(
|
|
66
65
|
'>>>>>>>>>>>>>>>>>>> 楼层【id=' + containerId + '】已经渲染!',
|
|
67
66
|
)
|
|
68
67
|
const modularPackResult = floorData?.floorExtInfo?.modularPackResult
|
|
69
68
|
const modularPackResultObj =
|
|
70
69
|
typeof modularPackResult === 'string'
|
|
71
70
|
? JSON.parse(modularPackResult)
|
|
72
71
|
: modularPackResult
|
|
73
72
|
if (modularPackResultObj && modularPackResultObj.bundleUrl) {
|
|
74
73
|
const { bundleUrl } = modularPackResultObj
|
|
75
74
|
nativePageRegisterMessage(Message_Type.NATIVE_INJECT_JS_FILE, {
|
|
76
75
|
data: {
|
|
77
76
|
bundleUrl: [bundleUrl],
|
|
78
77
|
},
|
|
79
78
|
})
|
|
80
79
|
}
|
|
81
80
|
}
|
|
82
81
|
}, [componentShowState, inView])
|
|
83
82
|
|
|
84
83
|
const dealPageScrollInfo = (res, pageScrollTrigger) => {
|
|
85
84
|
const { displayHeight, offSetY } = getNativePageScrollRes(res) || {}
|
|
86
85
|
if (
|
|
87
86
|
typeof displayHeight === 'undefined' ||
|
|
88
87
|
typeof offSetY === 'undefined'
|
|
89
88
|
) {
|
|
90
89
|
const shopId = floorData?.floorExtInfo?.shopId
|
|
91
90
|
if (!lazyLayoutLoadErrorShopId[`${shopId}`] && pageScrollTrigger) {
|
|
92
91
|
const opt = {
|
|
93
92
|
msg: `店铺楼层懒加载失败。楼层顺序-floorIdx: ${floorData?.floorIdx}。`,
|
|
94
93
|
uid: floorData?.uid,
|
|
95
94
|
floorIdx: floorData?.floorIdx,
|
|
96
95
|
shopId: shopId,
|
|
97
96
|
moduleId: floorData?.moduleId,
|
|
98
97
|
moduleName: floorData?.moduleName,
|
|
99
98
|
middleTemplateId: floorData?.middleTemplateId,
|
|
100
99
|
}
|
|
101
100
|
sgmCustomReport({
|
|
102
101
|
code: getSgmCustomCode(SgmCustomCode.FLOORLAZYLOAD_DATA),
|
|
103
102
|
msg: opt,
|
|
104
103
|
})
|
|
105
104
|
lazyLayoutLoadErrorShopId[`${shopId}`] = true
|
|
106
105
|
}
|
|
107
106
|
return
|
|
108
107
|
}
|
|
109
108
|
if (componentLazyRef.current) {
|
|
110
109
|
const eleClientRect = componentLazyRef.current.getBoundingClientRect()
|
|
111
110
|
const getContainerHeightOffSetY = displayHeight + offSetY
|
|
112
111
|
const eleOffsetTop = Math.ceil(eleClientRect.top)
|
|
113
112
|
const eleOffsetHeight = Math.ceil(eleClientRect.height)
|
|
114
113
|
const eleOffsetTopHeight = eleOffsetTop + eleOffsetHeight
|
|
115
114
|
if (!componentShowStateRef.current) {
|
|
116
115
|
if (getContainerHeightOffSetY > eleOffsetTop) {
|
|
117
116
|
componentShowStateRef.current = true
|
|
118
117
|
setComponentShowState(true)
|
|
119
118
|
Taro.nextTick(() => {
|
|
120
119
|
setComponentRenderShowState(true)
|
|
121
120
|
})
|
|
122
121
|
}
|
|
123
122
|
}
|
|
124
123
|
}
|
|
125
124
|
}
|
|
126
125
|
return isH5AndJdShopView && !needShowHighVersion ? (
|
|
127
126
|
<div
|
|
128
127
|
id={`${containerId}_lazy`}
|
|
129
128
|
ref={componentLazyRef}
|
|
130
129
|
className={classNames(
|
|
131
130
|
lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
|
|
132
131
|
'd-app-floor-lazy-load',
|
|
133
132
|
)}
|
|
134
133
|
style={{
|
|
135
134
|
minHeight: `${componentRenderShowState ? 'auto' : height + 'px'}`,
|
|
136
135
|
backgroundColor: componentRenderShowState ? 'transparent' : '#ffffff',
|
|
137
136
|
}}
|
|
138
137
|
>
|
|
139
138
|
{componentShowState ? children : placeholder}
|
|
140
139
|
</div>
|
|
141
140
|
) : (
|
|
142
141
|
<div
|
|
143
142
|
id={`${containerId}_lazy`}
|
|
144
143
|
className={classNames(
|
|
145
144
|
lazyLayoutLoadStyle['d-mobile-floor-lazy-layout-load'],
|
|
146
145
|
'd-mobile-floor-lazy-load',
|
|
147
146
|
lazyNodeClassName,
|
|
148
147
|
)}
|
|
149
148
|
ref={ref}
|
|
150
149
|
style={{
|
|
151
150
|
minHeight: `${inView ? 'auto' : height + 'px'}`,
|
|
152
151
|
backgroundColor: inView ? 'transparent' : '#ffffff',
|
|
153
152
|
}}
|
|
154
153
|
>
|
|
155
154
|
{inView ? children : placeholder}
|
|
156
155
|
</div>
|
|
157
156
|
)
|
|
157
|
+
import Taro, { useRouter } from '@tarojs/taro'
|
|
158
158
|
isH5AndJdShopView,
|
|
159
159
|
isH5AndJdShopViewH5Scroll,
|
|
160
160
|
sgmCustomReport,
|
|
161
161
|
getSgmCustomCode,
|
|
162
162
|
SECTION_HOME_TAB_TYPE,
|
|
163
163
|
SECTION_HOME_TAB_NAME_TYPE,
|
|
164
164
|
TaroEventType,
|
|
165
165
|
latestFromNativeMsgStorage,
|
|
166
166
|
nativePageRegisterMessage,
|
|
167
167
|
Message_Type,
|
|
168
168
|
getNativePageScrollRes,
|
|
169
169
|
const {
|
|
170
170
|
sectionType = SECTION_HOME_TAB_NAME_TYPE[
|
|
171
171
|
SECTION_HOME_TAB_TYPE.HOME_WELL_CHOSEN
|
|
172
172
|
],
|
|
173
173
|
type = LazyType.FLOOR,
|
|
174
174
|
children = null,
|
|
175
175
|
placeholder = null,
|
|
176
176
|
height = 200,
|
|
177
177
|
className = '',
|
|
178
178
|
lazyNodeClassName = '',
|
|
179
179
|
containerId,
|
|
180
180
|
floorData = {},
|
|
181
181
|
} = props
|
|
182
182
|
const getRouterInfo = useRouter()
|
|
183
183
|
const getQueryData = getRouterInfo?.params || {}
|
|
184
184
|
const [componentShowState, setComponentShowState] = useState(false)
|
|
185
185
|
const [componentRenderShowState, setComponentRenderShowState] =
|
|
186
186
|
useState(false)
|
|
187
187
|
const componentLazyRef = useRef<HTMLElement | null>(null)
|
|
188
188
|
const componentShowStateRef = useRef(false)
|
|
189
189
|
const needShowHighVersion =
|
|
190
190
|
isH5AndJdShopViewH5Scroll &&
|
|
191
191
|
!(
|
|
192
192
|
global.info.queryInfo?.downgraded &&
|
|
193
193
|
global.info.queryInfo.downgraded === 'true'
|
|
194
194
|
)
|
|
195
195
|
const rootDom =
|
|
196
196
|
isH5AndJdShopView && needShowHighVersion
|
|
197
197
|
? null
|
|
198
198
|
: document.querySelector('#J_shopHomeRoot')
|
|
199
199
|
const { ref, inView } = useInView({
|
|
200
200
|
threshold: 0,
|
|
201
201
|
triggerOnce: true,
|
|
202
202
|
root: rootDom,
|
|
203
203
|
rootMargin: `0px 0px ${window.innerHeight}px 0px`,
|
|
204
204
|
})
|
|
205
205
|
useEffect(() => {
|
|
206
206
|
if (needShowHighVersion || !isH5AndJdShopView) return
|
|
207
207
|
if (type === LazyType.FLOOR) {
|
|
208
208
|
const latestRes =
|
|
209
209
|
latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
|
|
210
210
|
!componentShowStateRef.current && dealPageScrollInfo(latestRes, false)
|
|
211
211
|
Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
|
|
212
212
|
!componentShowStateRef.current && dealPageScrollInfo(res, true)
|
|
213
213
|
})
|
|
214
214
|
}
|
|
215
215
|
}, [])
|
|
216
216
|
useEffect(() => {
|
|
217
217
|
if (
|
|
218
218
|
(!needShowHighVersion && componentShowState === true) ||
|
|
219
219
|
(needShowHighVersion && inView && isH5AndJdShopView)
|
|
220
220
|
) {
|
|
221
221
|
console.log(
|
|
222
222
|
'>>>>>>>>>>>>>>>>>>> 楼层【id=' + containerId + '】已经渲染!',
|
|
223
223
|
)
|
|
224
224
|
const modularPackResult = floorData?.floorExtInfo?.modularPackResult
|
|
225
225
|
const modularPackResultObj =
|
|
226
226
|
typeof modularPackResult === 'string'
|
|
227
227
|
? JSON.parse(modularPackResult)
|
|
228
228
|
: modularPackResult
|
|
229
229
|
if (modularPackResultObj && modularPackResultObj.bundleUrl) {
|
|
230
230
|
const { bundleUrl } = modularPackResultObj
|
|
231
231
|
nativePageRegisterMessage(Message_Type.NATIVE_INJECT_JS_FILE, {
|
|
232
232
|
data: {
|
|
233
233
|
bundleUrl: [bundleUrl],
|
|
234
234
|
},
|
|
235
235
|
})
|
|
236
236
|
}
|
|
237
237
|
}
|
|
238
238
|
}, [componentShowState, inView])
|
|
239
239
|
|
|
240
240
|
const dealPageScrollInfo = (res, pageScrollTrigger) => {
|
|
241
241
|
const { displayHeight, offSetY } = getNativePageScrollRes(res) || {}
|
|
242
242
|
if (
|
|
243
243
|
typeof displayHeight === 'undefined' ||
|
|
244
244
|
typeof offSetY === 'undefined'
|
|
245
245
|
) {
|
|
246
246
|
const shopId = floorData?.floorExtInfo?.shopId
|
|
247
247
|
if (!lazyLayoutLoadErrorShopId[`${shopId}`] && pageScrollTrigger) {
|
|
248
248
|
const opt = {
|
|
249
249
|
msg: `店铺楼层懒加载失败。楼层顺序-floorIdx: ${floorData?.floorIdx}。`,
|
|
250
250
|
uid: floorData?.uid,
|
|
251
251
|
floorIdx: floorData?.floorIdx,
|
|
252
252
|
shopId: shopId,
|
|
253
253
|
moduleId: floorData?.moduleId,
|
|
254
254
|
moduleName: floorData?.moduleName,
|
|
255
255
|
middleTemplateId: floorData?.middleTemplateId,
|
|
256
256
|
}
|
|
257
257
|
sgmCustomReport({
|
|
258
258
|
code: getSgmCustomCode(SgmCustomCode.FLOORLAZYLOAD_DATA),
|
|
259
259
|
msg: opt,
|
|
260
260
|
})
|
|
261
261
|
lazyLayoutLoadErrorShopId[`${shopId}`] = true
|
|
262
262
|
}
|
|
263
263
|
return
|
|
264
264
|
}
|
|
265
265
|
if (componentLazyRef.current) {
|
|
266
266
|
const eleClientRect = componentLazyRef.current.getBoundingClientRect()
|
|
267
267
|
const getContainerHeightOffSetY = displayHeight + offSetY
|
|
268
268
|
const eleOffsetTop = Math.ceil(eleClientRect.top)
|
|
269
269
|
const eleOffsetHeight = Math.ceil(eleClientRect.height)
|
|
270
270
|
const eleOffsetTopHeight = eleOffsetTop + eleOffsetHeight
|
|
271
271
|
if (!componentShowStateRef.current) {
|
|
272
272
|
if (getContainerHeightOffSetY > eleOffsetTop) {
|
|
273
273
|
componentShowStateRef.current = true
|
|
274
274
|
setComponentShowState(true)
|
|
275
275
|
Taro.nextTick(() => {
|
|
276
276
|
setComponentRenderShowState(true)
|
|
277
277
|
})
|
|
278
278
|
}
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
281
|
}
|
|
282
282
|
return isH5AndJdShopView && !needShowHighVersion ? (
|
|
283
283
|
<div
|
|
284
284
|
id={`${containerId}_lazy`}
|
|
285
285
|
ref={componentLazyRef}
|
|
286
286
|
className={classNames(
|
|
287
287
|
lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
|
|
288
288
|
'd-app-floor-lazy-load',
|
|
289
289
|
)}
|
|
290
290
|
style={{
|
|
291
291
|
minHeight: `${componentRenderShowState ? 'auto' : height + 'px'}`,
|
|
292
292
|
backgroundColor: componentRenderShowState ? 'transparent' : '#ffffff',
|
|
293
293
|
}}
|
|
294
294
|
>
|
|
295
295
|
{componentShowState ? children : placeholder}
|
|
296
296
|
</div>
|
|
297
297
|
) : (
|
|
298
298
|
<div
|
|
299
299
|
id={`${containerId}_lazy`}
|
|
300
300
|
className={classNames(
|
|
301
301
|
lazyLayoutLoadStyle['d-mobile-floor-lazy-layout-load'],
|
|
302
302
|
'd-mobile-floor-lazy-load',
|
|
303
303
|
lazyNodeClassName,
|
|
304
304
|
)}
|
|
305
305
|
ref={ref}
|
|
306
306
|
style={{
|
|
307
307
|
minHeight: `${inView ? 'auto' : height + 'px'}`,
|
|
308
308
|
backgroundColor: inView ? 'transparent' : '#ffffff',
|
|
309
309
|
}}
|
|
310
310
|
>
|
|
311
311
|
{inView ? children : placeholder}
|
|
312
312
|
</div>
|
|
313
313
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import { NETWORK_DATA_TYPE } from '../../../common/const'
|
|
2
1
|
[NETWORK_DATA_TYPE.NO_NET_WORK]: '网络连接已断开',
|
|
3
2
|
[NETWORK_DATA_TYPE.DATA_ERROR]: '数据加载失败',
|
|
4
3
|
[NETWORK_DATA_TYPE.NO_DATA]: '你访问的内容飞到太空了',
|
|
5
4
|
[NETWORK_DATA_TYPE.RISK]: '活动太火爆',
|
|
6
5
|
[NETWORK_DATA_TYPE.NO_NET_WORK]: '请检查您的网络设置',
|
|
7
6
|
[NETWORK_DATA_TYPE.DATA_ERROR]: '请稍后重试',
|
|
8
7
|
[NETWORK_DATA_TYPE.NO_DATA]: '',
|
|
9
8
|
[NETWORK_DATA_TYPE.RISK]: '页面加载失败,请稍后再试',
|
|
10
9
|
NETWORK_DATA_TYPE.NO_NET_WORK,
|
|
11
10
|
NETWORK_DATA_TYPE.DATA_ERROR,
|
|
12
11
|
NETWORK_DATA_TYPE.NO_DATA,
|
|
13
12
|
NETWORK_DATA_TYPE.RISK,
|
|
14
13
|
No_Data_Bmall:'no-data-bmall',
|
|
14
|
+
import { NETWORK_DATA_TYPE } from '../../../common/const';
|
|
15
15
|
[NETWORK_DATA_TYPE.NO_NET_WORK]: global?.languageJsonData?.loseNetwork || '网络连接已断开',
|
|
16
16
|
[NETWORK_DATA_TYPE.DATA_ERROR]:
|
|
17
17
|
global?.languageJsonData?.highTraffic || '活动太火爆,访问人数较多',
|
|
18
18
|
[NETWORK_DATA_TYPE.NO_DATA]: global?.languageJsonData?.highTraffic || '活动太火爆,访问人数较多',
|
|
19
19
|
[NETWORK_DATA_TYPE.RISK]: global?.languageJsonData?.highTraffic || '活动太火爆,访问人数较多',
|
|
20
20
|
[NETWORK_DATA_TYPE.NO_NET_WORK]: global?.languageJsonData?.checkNetwork || '请检查您的网络设置',
|
|
21
21
|
[NETWORK_DATA_TYPE.DATA_ERROR]:
|
|
22
22
|
global?.languageJsonData?.pageLoadFailed || '排队进场中,请稍后再试',
|
|
23
23
|
[NETWORK_DATA_TYPE.NO_DATA]: global?.languageJsonData?.pageLoadFailed || '排队进场中,请稍后再试',
|
|
24
24
|
[NETWORK_DATA_TYPE.RISK]: `${
|
|
25
25
|
global?.languageJsonData?.pageLoadFailed || '排队进场中,请稍后再试'
|
|
26
26
|
}。`,
|
|
27
27
|
NETWORK_DATA_TYPE.NO_NET_WORK,
|
|
28
28
|
NETWORK_DATA_TYPE.DATA_ERROR,
|
|
29
29
|
NETWORK_DATA_TYPE.NO_DATA,
|
|
30
30
|
NETWORK_DATA_TYPE.RISK,
|
|
31
31
|
PART: 'part',
|
|
32
32
|
FULL: 'full',
|
|
33
33
|
No_Data_Default_Tip: 'no-data-default-tip',
|
|
34
34
|
No_Data_Tip_1: 'no-data-tip-1',
|
|
35
35
|
No_Data_Tip_2: 'no-data-tip-2',
|
|
36
36
|
No_Network_Err_Tip: 'no-network',
|
|
37
37
|
No_Data_Bmall: 'no-data-bmall',
|
|
38
38
|
OLD: 'old',
|
|
39
39
|
NEW: 'new',
|