ccy/mh-sms-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

首页自适应优化

Browse Source
This commit is contained in:
yunkexin 2024-04-26 17:05:04 +08:00
parent 5b94b53dd5
commit f61a16911b
3 changed files with 80 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/layout/main.less
View File

@ -29,6 +29,8 @@
flex-direction: column;
flex: 1;
width: calc(100% - 100px);
// overflow-x: hidden;
overflow: auto;
}
&-sider {

120
src/routes/Home.js
View File

@ -108,22 +108,19 @@ const WorkBench = (props) => {
style={{
marginLeft: "20px",
marginRight: "20px",
whiteSpace: "nowrap",
}}
>
{type}
</div>
<div
className="home-work-title"
style={{ flex: 1, alignItems: "flex-start" }}
>
{item.NOTICE_TITLE}
</div>
<div className="home-work-title">{item.NOTICE_TITLE}</div>
<div
className="home-work-date"
style={{
width: "200px",
marginRight: "100px",
// width: "200px",
whiteSpace: "nowrap",
marginRight: "20px",
}}
>
开始时间：{item.TASK_STARTDT}
@ -131,8 +128,9 @@ const WorkBench = (props) => {
<div
className="home-work-date"
style={{
width: "200px",
marginRight: "50px",
// width: "200px",
whiteSpace: "nowrap",
marginRight: "10px",
}}
>
结束时间：{item.TASK_ENDDT}
@ -1575,10 +1573,10 @@ class Home extends React.Component {
width: "100%",
height: "25%",
display: "flex",
padding: "0px 20px",
// padding: "0px 20px",
margin: "0px",
minHeight: "242px",
minWidth: "1704px",
minWidth: "1136px",
// justifyContent: "space-between",
// backgroundColor: "#fff",
}}
@ -1592,7 +1590,7 @@ class Home extends React.Component {
flexDirection: "column",
padding: "0px 20px",
borderRadius: "5px 0px 0px 5px",
minWidth: "578px",
minWidth: "453px",
}}
>
<div
@ -1732,14 +1730,14 @@ class Home extends React.Component {
</div>
<div style={{ display: "flex", flexDirection: "row" }}>
<div
{/* <div
className="home-userInfo-tabs"
style={{
marginRight: "10px",
}}
>
工号：{this.state.userInfo.CODE}
</div>
</div> */}
<div
className="home-userInfo-tabs"
style={{
@ -1759,38 +1757,46 @@ class Home extends React.Component {
</div>
</div>
<div className="home-userInfo-card">
<UserInfo
data={this.state.workTotal.todoCount}
title="待办事项"
color="#2177d5"
showAll={() => {
this.showAll("1");
}}
/>
<UserInfo
data={this.state.workTotal.timeOverCount}
title="待办超时"
color="#f76707"
showAll={() => {
this.showAll("4");
}}
/>
<UserInfo
data={this.state.workTotal.doneCount}
title="已办事项"
color="#48a447"
showAll={() => {
this.showAll("2");
}}
/>
<UserInfo
data={this.state.workTotal.todayNewCount}
title="今日提醒"
color="#fcc419"
showAll={() => {
this.showAll("3");
}}
/>
<Col span={6}>
<UserInfo
data={this.state.workTotal.todoCount}
title="待办事项"
color="#2177d5"
showAll={() => {
this.showAll("1");
}}
/>
</Col>
<Col span={6}>
<UserInfo
data={this.state.workTotal.timeOverCount}
title="待办超时"
color="#f76707"
showAll={() => {
this.showAll("4");
}}
/>
</Col>
<Col span={6}>
<UserInfo
data={this.state.workTotal.doneCount}
title="已办事项"
color="#48a447"
showAll={() => {
this.showAll("2");
}}
/>
</Col>
<Col span={6}>
<UserInfo
data={this.state.workTotal.todayNewCount}
title="今日提醒"
color="#fcc419"
showAll={() => {
this.showAll("3");
}}
/>
</Col>
</div>
</Col>
{/* <div style={{ width: "30px" }}></div> */}
@ -1874,7 +1880,7 @@ class Home extends React.Component {
borderRadius: "5px",
display: "flex",
flexDirection: "column",
minWidth: "466px",
minWidth: "344px",
}}
>
<div className="home-always-title">
@ -1955,12 +1961,14 @@ class Home extends React.Component {
width: "100%",
height: "40%",
display: "flex",
padding: "0px 20px",
// padding: "0px 20px",
margin: "30px 0px",
justifyContent: "space-between",
// justifyContent: "space-between",
alignItems: "center",
minHeight: "388px",
minWidth: "1704px",
overflow:'hidden',
// minWidth: "1204px",
minWidth: "1136px",
// backgroundColor: "#fff",
}}
>
@ -1973,8 +1981,9 @@ class Home extends React.Component {
flexDirection: "column",
padding: "0px",
borderRadius: "5px",
overflow:'hidden',
flex: 1,
minWidth: "1168px",
// minWidth: "768px",
}}
>
<div className="home-always-title">
@ -2125,7 +2134,7 @@ class Home extends React.Component {
borderRadius: "5px",
display: "flex",
flexDirection: "column",
minWidth: "466px",
minWidth: "344px",
}}
>
<div className="home-always-title">
@ -2200,7 +2209,8 @@ class Home extends React.Component {
style={{
margin: "0px 0px 10px 0px",
minHeight: "275px",
minWidth: "1704px",
// minWidth: "1204px",
minWidth: "1136px",
}}
>
<Col
@ -2285,7 +2295,7 @@ class Home extends React.Component {
borderRadius: "5px",
display: "flex",
flexDirection: "column",
minWidth: "466px",
minWidth: "344px",
}}
>
<div className="home-always-title">

18
src/routes/dashboard.css
View File

@ -34,6 +34,7 @@
padding: 3px 10px;
border-radius: 15px;
border: 1px solid #55c596;
white-space: nowrap;
}
:global(.home-userInfo-card) {
height: 50%;
@ -52,7 +53,8 @@
height: 100%;
justify-content: space-between;
border-radius: 10px;
width: calc(25% - 10px);
min-width: 100px;
/* width: calc(25% - 10px); */
}
:global(.home-userInfo-pad) {
display: flex;
@ -69,6 +71,7 @@
color: #303133;
font-weight: bold;
white-space: nowrap;
margin-right: 5px;
}
:global(.home-userInfo-content) {
font-size: 24px;
@ -143,7 +146,7 @@
width: 100%;
height: calc(35% - 70px);
display: flex;
padding: 0px 20px;
/* padding: 0px 20px; */
justify-content: space-between;
align-items: center;
}
@ -173,8 +176,11 @@
:global(.home-rank-name) {
color: #303133;
font-size: 13px;
margin-right: 40px;
margin-right: 20px;
width: 90px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
:global(.home-img) {
object-fit: contain;
@ -328,10 +334,12 @@
font-size: 15px;
color: #303133;
padding: 5px 0px;
font-weight: bold;
/* font-weight: bold; */
white-space: nowrap;
/* width: 250px; */
overflow: hidden;
text-overflow: ellipsis;
flex: 1;
}
:global(.home-work-date) {
color: #909399;
@ -349,7 +357,7 @@
flex-direction: column;
background-color: #fff;
border-radius: 5px;
min-width: 574px;
/* min-width: 374px; */
}
:global(.home-setting) {
display: flex;