Commit 54b10b9e authored by 陶晶晶's avatar 陶晶晶

fix:集成登录分辨率适配

parent eba1e801
...@@ -43,6 +43,8 @@ const IntegrationQinzhou = props => { ...@@ -43,6 +43,8 @@ const IntegrationQinzhou = props => {
const [ref, isFullscreen, handleFullScreen, handleExitFullScreen] = useFullScreen(false); const [ref, isFullscreen, handleFullScreen, handleExitFullScreen] = useFullScreen(false);
const clientRef = useRef(props.global.client); const clientRef = useRef(props.global.client);
const jpRef = useRef();
const cardRef = useRef();
const integrationClient = integratedConfig?.client || window?.globalConfig?.client || 'city'; // 集成登录client const integrationClient = integratedConfig?.client || window?.globalConfig?.client || 'city'; // 集成登录client
const [integrationData, setIntegrationData] = useState({}); // 所有子站 const [integrationData, setIntegrationData] = useState({}); // 所有子站
...@@ -142,7 +144,18 @@ const IntegrationQinzhou = props => { ...@@ -142,7 +144,18 @@ const IntegrationQinzhou = props => {
scale: n, scale: n,
boxHeight: bHeight, boxHeight: bHeight,
}); });
if (jpRef?.current && n) {
const jpHeight = bHeight * n
const bl = (Math.abs(clientHeight - jpHeight)) / 2
jpRef.current.style.bottom = `${(184 - bl)}px`
} }
if (cardRef?.current && n) {
const jpHeight = bHeight * n
const bl = (Math.abs(clientHeight - jpHeight)) / 2
cardRef.current.style.bottom = `-${(bl)}px`
}
}
}; };
const startTiming = (time = 2) => { const startTiming = (time = 2) => {
...@@ -326,7 +339,7 @@ const IntegrationQinzhou = props => { ...@@ -326,7 +339,7 @@ const IntegrationQinzhou = props => {
}, [loginAction.events, props]); }, [loginAction.events, props]);
return ( return (
<div className={classNames(styles.integrationQinzhou, 'integrationQinzhou')} style={{ background: `url(${BGIcon}) center/100% 100% no-repeat` }} ref={ref}> <div className={classNames(styles.integrationQinzhou, 'integrationQinzhou')} style={{ background: `url(${BGIcon}) center/100% 100% no-repeat` }} ref={ref} >
{/* 动态特效 */} {/* 动态特效 */}
<div className={styles.DX1} style={{ background: `url(${dxIcon}) no-repeat center center` }} /> <div className={styles.DX1} style={{ background: `url(${dxIcon}) no-repeat center center` }} />
...@@ -381,8 +394,7 @@ const IntegrationQinzhou = props => { ...@@ -381,8 +394,7 @@ const IntegrationQinzhou = props => {
</div> </div>
</div> </div>
</div> </div>
<div className={styles.showCenter} > <div ref={jpRef} className={styles.showCenter} style={{ zIndex: 100 }} >
{/* 动效1 */}
<img src={Icon10} <img src={Icon10}
className={ className={
integrationData['平台总览'] ? integrationData['平台总览'] ?
...@@ -392,7 +404,7 @@ const IntegrationQinzhou = props => { ...@@ -392,7 +404,7 @@ const IntegrationQinzhou = props => {
title='点击平台总览跳转' title='点击平台总览跳转'
onClick={() => { onLink(integrationData['平台总览'], loginAction) }} /> onClick={() => { onLink(integrationData['平台总览'], loginAction) }} />
</div> </div>
<div className={styles.integrationTips}> <div ref={cardRef} className={styles.integrationTips}>
{ {
BIConfig.map(item => { BIConfig.map(item => {
return <div return <div
...@@ -403,7 +415,6 @@ const IntegrationQinzhou = props => { ...@@ -403,7 +415,6 @@ const IntegrationQinzhou = props => {
name={item.name} name={item.name}
onClick={() => { item.name ? onLink(integrationData[item.name], loginAction) : null }} onClick={() => { item.name ? onLink(integrationData[item.name], loginAction) : null }}
> >
{/* tipIcon */}
<div className={styles.integration_TitBG} style={{ background: `url(${tipIcon}) center/100% 100% no-repeat` }} >{item.name}</div> <div className={styles.integration_TitBG} style={{ background: `url(${tipIcon}) center/100% 100% no-repeat` }} >{item.name}</div>
<img src={item.icon} /> <img src={item.icon} />
</div> </div>
......
...@@ -171,7 +171,8 @@ ...@@ -171,7 +171,8 @@
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: center; justify-content: center;
top: calc(50vh - 290px); // top: calc(50vh - 290px);
bottom: 185px;
img { img {
width: 344px; width: 344px;
...@@ -185,6 +186,7 @@ ...@@ -185,6 +186,7 @@
justify-content: space-around; justify-content: space-around;
width: 100%; width: 100%;
top: -11px; top: -11px;
height: 360px;
.integration_card { .integration_card {
text-align: center; text-align: center;
...@@ -247,9 +249,14 @@ ...@@ -247,9 +249,14 @@
cursor: not-allowed; cursor: not-allowed;
} }
.integration_row_col_link {
transition: transform 0.3s ease;
/* 平滑过渡 */
}
.integration_row_col_link:hover { .integration_row_col_link:hover {
filter: brightness(120%); filter: brightness(120%);
margin-top: -10px; transform: translateY(-10px);
} }
// 业务应用start // 业务应用start
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment