free-sun
/
OperationalService
15
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix 控制台滚动

dev
巴林闲侠 2 years ago
parent
b25f39a02f
commit
ffdc9a9646
1 changed files with 156 additions and 83 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 239
      web/client/src/sections/control/containers/control.jsx

239
web/client/src/sections/control/containers/control.jsx
View File

@ -100,6 +100,50 @@ const Control = (props) => {
}) })
} }
concentration2() concentration2()
const domProject = document.getElementById("news");
if (domProject) {
newScrollbar = new PerfectScrollbar("#news", {
suppressScrollX: true,
});
}
const domProject2 = document.getElementById("member");
if (domProject2) {
memberScrollbar = new PerfectScrollbar("#member", {
suppressScrollX: true,
});
}
const domProject3 = document.getElementById("equipment");
if (domProject3) {
equipmentScrollbar = new PerfectScrollbar("#equipment", {
suppressScrollX: true,
});
}
const domProject4 = document.getElementById("web");
if (domProject4) {
webScrollbar = new PerfectScrollbar("#web", {
suppressScrollX: true,
})
}
const domProject5 = document.getElementById("problems");
if (domProject5) {
problemsScrollbar = new PerfectScrollbar("#problems", {
suppressScrollX: true,
});
}
const domProject6 = document.getElementById("alarm");
if (domProject6) {
alarmScrollbar = new PerfectScrollbar("#alarm", {
suppressScrollY: true,
});
}
return () => { return () => {
} }
@ -271,6 +315,25 @@ const Control = (props) => {
} }
} }
concentration3() concentration3()
const domProject1 = document.getElementById("overviewCalc");
if (domProject1) {
overviewScrollbar = new PerfectScrollbar("#overviewCalc", {
suppressScrollY: true,
});
}
const pomsList = document.getElementById("pomsList");
if (pomsList) {
pomsListScrollbar = new PerfectScrollbar("#pomsList", {
suppressScrollX: true,
});
}
const domProject5 = document.getElementById("problems");
if (domProject5) {
problemsScrollbar = new PerfectScrollbar("#problems", {
suppressScrollX: true,
});
}
}, [pepProjectId, exhibition.current]) }, [pepProjectId, exhibition.current])
useEffect(() => { useEffect(() => {
@ -342,9 +405,9 @@ const Control = (props) => {
const domProject = document.getElementById("news"); const domProject = document.getElementById("news");
if (domProject) { if (domProject) {
newScrollbar = new PerfectScrollbar("#news", { // newScrollbar = new PerfectScrollbar("#news", {
suppressScrollX: true, // suppressScrollX: true,
}); // });
if (domProject && newScrollbar) { if (domProject && newScrollbar) {
newScrollbar.update(); newScrollbar.update();
} }
@ -352,19 +415,19 @@ const Control = (props) => {
const pomsList = document.getElementById("pomsList"); const pomsList = document.getElementById("pomsList");
if (pomsList) { if (pomsList) {
pomsListScrollbar = new PerfectScrollbar("#pomsList", { // pomsListScrollbar = new PerfectScrollbar("#pomsList", {
suppressScrollX: true, // suppressScrollX: true,
}); // });
if (pomsList && pomsListScrollbar) { if (pomsList && pomsListScrollbar) {
pomsListScrollbar.update(); pomsListScrollbar.update();
} }
} }
const domProject1 = document.getElementById("overview"); const domProject1 = document.getElementById("overviewCalc");
if (domProject1) { if (domProject1) {
overviewScrollbar = new PerfectScrollbar("#overview", { // overviewScrollbar = new PerfectScrollbar("#overviewCalc", {
suppressScrollY: true, // suppressScrollY: true,
}); // });
if (domProject1 && overviewScrollbar) { if (domProject1 && overviewScrollbar) {
overviewScrollbar.update(); overviewScrollbar.update();
} }
@ -372,9 +435,9 @@ const Control = (props) => {
const domProject2 = document.getElementById("member"); const domProject2 = document.getElementById("member");
if (domProject2) { if (domProject2) {
memberScrollbar = new PerfectScrollbar("#member", { // memberScrollbar = new PerfectScrollbar("#member", {
suppressScrollX: true, // suppressScrollX: true,
}); // });
if (domProject2 && memberScrollbar) { if (domProject2 && memberScrollbar) {
memberScrollbar.update(); memberScrollbar.update();
} }
@ -382,9 +445,9 @@ const Control = (props) => {
const domProject3 = document.getElementById("equipment"); const domProject3 = document.getElementById("equipment");
if (domProject3) { if (domProject3) {
equipmentScrollbar = new PerfectScrollbar("#equipment", { // equipmentScrollbar = new PerfectScrollbar("#equipment", {
suppressScrollX: true, // suppressScrollX: true,
}); // });
if (domProject3 && equipmentScrollbar) { if (domProject3 && equipmentScrollbar) {
equipmentScrollbar.update(); equipmentScrollbar.update();
} }
@ -392,9 +455,9 @@ const Control = (props) => {
const domProject4 = document.getElementById("web"); const domProject4 = document.getElementById("web");
if (domProject4) { if (domProject4) {
webScrollbar = new PerfectScrollbar("#web", { // webScrollbar = new PerfectScrollbar("#web", {
suppressScrollX: true, // suppressScrollX: true,
}) // })
if (domProject4 && webScrollbar) { if (domProject4 && webScrollbar) {
webScrollbar.update(); webScrollbar.update();
} }
@ -402,9 +465,9 @@ const Control = (props) => {
const domProject5 = document.getElementById("problems"); const domProject5 = document.getElementById("problems");
if (domProject5) { if (domProject5) {
problemsScrollbar = new PerfectScrollbar("#problems", { // problemsScrollbar = new PerfectScrollbar("#problems", {
suppressScrollX: true, // suppressScrollX: true,
}); // });
if (domProject5 && problemsScrollbar) { if (domProject5 && problemsScrollbar) {
problemsScrollbar.update(); problemsScrollbar.update();
} }
@ -412,9 +475,9 @@ const Control = (props) => {
const domProject6 = document.getElementById("alarm"); const domProject6 = document.getElementById("alarm");
if (domProject6) { if (domProject6) {
alarmScrollbar = new PerfectScrollbar("#alarm", { // alarmScrollbar = new PerfectScrollbar("#alarm", {
suppressScrollY: true, // suppressScrollY: true,
}); // });
if (domProject6 && alarmScrollbar) { if (domProject6 && alarmScrollbar) {
alarmScrollbar.update(); alarmScrollbar.update();
} }
@ -634,7 +697,8 @@ const Control = (props) => {
{/* 统计概览 */} {/* 统计概览 */}
{exhibition.current?.overall?.find(v => v.key == 'statistical') ? <> {
exhibition.current?.overall?.find(v => v.key == 'statistical') ? <>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginTop: 25 }}> <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginTop: 25 }}>
<div style={{ display: 'flex', alignItems: 'center' }}> <div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 0, height: 20, borderLeft: '3px solid #005ABD', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> <div style={{ width: 0, height: 20, borderLeft: '3px solid #005ABD', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div>
@ -651,83 +715,92 @@ const Control = (props) => {
</div> </div>
</div> </div>
{/* 统计概览 */} {/* 统计概览 */}
<div id='overview' style={{ position: 'relative' }}> <div id='overviewCalc' style={{ width: 'calc(100% - 200px)', position: 'relative' }}>
<div style={{ display: 'inline-flex', marginTop: 16 }}> <div style={{ display: 'inline-flex', marginTop: 16 }}>
{/* 项目 */} {/* 项目 */}
{pepProjectId ? '' : <div id='pomsList' style={{ marginRight: 20, paddingRight: 24, position: 'relative', marginBottom: 30, width: 410, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}> {
{pomsList?.map((v, index) => { pepProjectId ?
return <div key={'pomsList' + index} title={v.pepProjectName} '' :
style={{ <div id='pomsList' style={{
width: 400, cursor: 'pointer', lineHeight: '30px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', fontSize: 14, color: '#969799', marginRight: 20, paddingRight: 24, position: 'relative', marginBottom: 30, width: 410, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
background: projectId == v.pepProjectId ? 'linear-gradient(252deg, #F9FBFF 0%, rgb(185 202 236) 100%)' : "", }}>
}} {pomsList?.map((v, index) => {
onClick={() => setProjectId(v.pepProjectId)}>{v.pepProjectName}</div> return <div key={'pomsList' + index} title={v.pepProjectName}
})} style={{
</div>} width: 400, cursor: 'pointer', lineHeight: '30px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', fontSize: 14, color: '#969799',
background: projectId == v.pepProjectId ? 'linear-gradient(252deg, #F9FBFF 0%, rgb(185 202 236) 100%)' : "",
}}
onClick={() => setProjectId(v.pepProjectId)}>{v.pepProjectName}</div>
})}
</div>}
{/* 项目里程碑 */} {/* 项目里程碑 */}
{exhibition.current?.statistical?.find(v => v.key == 'milestone') && projectId && projectData?.find(u => u.id == projectId)?.pepProjectName ? {
<div style={{ marginBottom: 30, width: 466, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}> exhibition.current?.statistical?.find(v => v.key == 'milestone') && projectId &&
<div style={{ margin: '20px 0px 20px 24px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}> projectData?.find(u => u.id == projectId)?.pepProjectName ?
项目里程碑 <div style={{
</div> marginBottom: 30, width: 466, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
<div style={{ display: 'flex', marginBottom: 20, marginLeft: 24 }}> }}>
<div style={{ display: 'flex' }}> <div style={{ margin: '20px 0px 20px 24px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}> 项目里程碑
立项时间：
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
</div> </div>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex', marginBottom: 20, marginLeft: 24 }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}> <div style={{ display: 'flex' }}>
施工时间： <div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
立项时间：
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
</div> </div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'> <div style={{ display: 'flex' }}>
暂无 <div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
施工时间：
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div> </div>
</div> </div>
</div> <div style={{ display: 'flex', marginBottom: 24, marginLeft: 24 }}>
<div style={{ display: 'flex', marginBottom: 24, marginLeft: 24 }}> <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> <div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}> 内验时间：
内验时间： </div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
</div> </div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'> <div style={{ display: 'flex' }}>
暂无 <div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
外验时间：
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div> </div>
</div> </div>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex', marginBottom: 17, marginLeft: 24 }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}> <div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
外验时间： 工程维保时间：
</div> </div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'> <div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无 暂无
</div> </div>
</div> </div>
</div> <div style={{ display: 'flex', background: 'linear-gradient(252deg, #F9FBFF 0%, #DBE7FF 100%)', height: 38, justifyContent: 'space-between' }}>
<div style={{ display: 'flex', marginBottom: 17, marginLeft: 24 }}> <div style={{ display: 'flex', marginLeft: 24, alignItems: 'center' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}> <div style={{ fontSize: 14, color: '#646566', marginRight: 4 }}>
工程维保时间： 售后维修时间：
</div> </div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'> <div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无 暂无
</div> </div>
</div>
<div style={{ display: 'flex', background: 'linear-gradient(252deg, #F9FBFF 0%, #DBE7FF 100%)', height: 38, justifyContent: 'space-between' }}>
<div style={{ display: 'flex', marginLeft: 24, alignItems: 'center' }}>
<div style={{ fontSize: 14, color: '#646566', marginRight: 4 }}>
售后维修时间：
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div> </div>
{/* <img src="/assets/images/console/onGoing.png" alt="进行中" /> */}
</div> </div>
{/* <img src="/assets/images/console/onGoing.png" alt="进行中" /> */}
</div> </div>
</div> : ""}
: ""}
{/* 相关成员 */} {/* 相关成员 */}
{exhibition.current?.statistical?.find(v => v.key == 'personnel') ? {exhibition.current?.statistical?.find(v => v.key == 'personnel') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}> <div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>

Write Preview
Loading…
Cancel
Save