Skip to content

S
sass-admin
Commit f7d999b5 by end
Options

修复工作台bug

parent 09f4cfd3
Showing with 599 additions and 451 deletions
dist.zip
No preview for this file type
src/common/UploadImageCover/index.js
......@@ -89,7 +89,7 @@ class UploadImageCover extends Component {
// Upload上传之前函数
beforeUpload = file => {
if (file.size > 20 * 1024 * 1024) {
if (file.size > 30 * 1024 * 1024) {
//bug-13496-liyuan
message.error("该图片超过大小，不支持上传"); //bug 15215
return false;
......@@ -133,9 +133,9 @@ class UploadImageCover extends Component {
.then(res => res.blob())
.then(blob => {
new Compressor(blob, {
quality: 0.7, // 压缩质量(0-1)，值越小压缩率越高
maxWidth: 1200, // 最大宽度限制
maxHeight: 1200, // 最大高度限制
quality: 0.3,// 压缩质量(0-1)，值越小压缩率越高
maxWidth: 1125, // 最大宽度限制
maxHeight: 540, // 最大高度限制
success: (compressedBlob) => {
// 创建压缩后的文件对象
const file = new File([compressedBlob], `${randomNumber}.jpg`, { type: 'image/jpeg' });
......
src/pages/Dashboard/index.js
......@@ -41,7 +41,7 @@ const siteCode = location.pathname.split("/")[2];
const date = new Date();
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate() > 10 ? date.getDate() - 1 : `0${date.getDate() - 1}`;
const day = date.getDate() > 10 ? date.getDate() : `0${date.getDate()}`;
const itemStyle = {
normal: {
opacity: 1,
......@@ -55,37 +55,38 @@ class homePage extends Component {
super(props);
this.state = {
dllTime: 3, //1年 2月 3日 4周
dllXtitle: ["今日", "昨日"],
dllXtitle: [`${month}-${day - 4}`, `${month}-${day - 3}`, `${month}-${day - 2}`, `${month}-${day - 1}`, `${month}-${day}`],
tgXtitle: [`${month}-${day - 4}`, `${month}-${day - 3}`, `${month}-${day - 2}`, `${month}-${day - 1}`, `${month}-${day}`],
lllTime: 3, //1年 2月 3日 4周
hdlTime: 1, //1年 2月 3日 4周
hdlType: 15, //11点赞 12收藏 13评论 15阅读
hdlTime: 3, //1年 2月 3日 4周
hdlType: 6, //11点赞 12收藏 13评论 6阅读
hdlOrg: "",
phbType: 2, //1支部 2用户
phbTime: 1, //1年 2月 3日 4周
phbTime: 3, //1年 2月 3日 4周
phbName: "支部", //1支部 2用户
tgTime: 3, //1年 2月 3日 4周
tgOrg1: "",
tgOrg2: "",
tgId: "",
currentPeriod: '今日', // 登录量添加周期状态
oldCurrentPeriod: '昨日', // 登录量添加对比周期状态
hdlcurrentPeriod: '今日', // 互动量添加周期状态
oldHdlCurrentPeriod: '昨日', // 互动量添加对比周期状态
};
}
// 登录量
dllChange = e => {
if (e == 1) {
this.setState({ dllTime: e, dllXtitle: ["今年", "去年"] }, () => {
this.setState({ dllTime: e, currentPeriod: "今年", oldCurrentPeriod: "去年", dllXtitle: [`${year - 4}年`, `${year - 3}年`, `${year - 2}年`, `${year - 1}年`, `${year}年`] }, () => {
this.getDllRes();
});
} else if (e == 2) {
this.setState({ dllTime: e, dllXtitle: ["本月", "上月"] }, () => {
this.setState({ dllTime: e, currentPeriod: "本月", oldCurrentPeriod: "上月", dllXtitle: [`${month - 4}月`, `${month - 3}月`, `${month - 2}月`, `${month - 1}月`, `${month}月`] }, () => {
this.getDllRes();
});
} else if (e == 3) {
this.setState({ dllTime: e, dllXtitle: ["今日", "昨日"] }, () => {
this.getDllRes();
});
} else if (e == 4) {
this.setState({ dllTime: e, dllXtitle: ["本周", "上周"] }, () => {
this.setState({ dllTime: e, currentPeriod: "今日", oldCurrentPeriod: "昨日", dllXtitle: [`${month}-${day - 4}`, `${month}-${day - 3}`, `${month}-${day - 2}`, `${month}-${day - 1}`, `${month}-${day}`] }, () => {
this.getDllRes();
});
}
......@@ -159,7 +160,7 @@ class homePage extends Component {
},
},
{
data: [dllData.num, dllData.preNum],
data: [dllData.fifthNum, dllData.fourtNum, dllData.thirdNum, dllData.preNum, dllData.num],
type: "bar",
barWidth: 20,
itemStyle: {
......@@ -544,9 +545,19 @@ class homePage extends Component {
};
//投稿总数
tgChange = e => {
this.setState({ tgTime: e }, () => {
if (e == 1) {
this.setState({ tgTime: e, tgXtitle: [`${year - 4}年`, `${year - 3}年`, `${year - 2}年`, `${year - 1}年`, `${year}年`] }, () => {
this.getTgRes();
});
} else if (e == 2) {
this.setState({ tgTime: e, tgXtitle: [`${month - 4}月`, `${month - 3}月`, `${month - 2}月`, `${month - 1}月`, `${month}月`] }, () => {
this.getTgRes();
});
} else if (e == 3) {
this.setState({ tgTime: e, tgXtitle: [`${month}-${day - 4}`, `${month}-${day - 3}`, `${month}-${day - 2}`, `${month}-${day - 1}`, `${month}-${day}`] }, () => {
this.getTgRes();
});
}
};
getTgRes = () => {
this.props.getTgData({
......@@ -567,7 +578,7 @@ class homePage extends Component {
xAxis: [
{
type: "category",
data: ["今日", "昨日"],
data: this.state.tgXtitle,
boundaryGap: ["0%", "0%"],
axisLine: {
show: false, // 确保显示 Y 轴线
......@@ -624,7 +635,13 @@ class homePage extends Component {
},
},
{
data: [tgData.num, tgData.preNum],
data: [
tgData.fifthNum === '' ? 0 : Number(tgData.fifthNum),
tgData.fourtNum === '' ? 0 : Number(tgData.fourtNum),
tgData.thirdNum === '' ? 0 : Number(tgData.thirdNum),
tgData.preNum === '' ? 0 : Number(tgData.preNum),
tgData.num === '' ? 0 : Number(tgData.num)
],
type: "bar",
barWidth: 20,
itemStyle: {
......@@ -784,6 +801,7 @@ class homePage extends Component {
render() {
const {
dllData,
actionList,
pbhChartList,
lllData,
......@@ -795,24 +813,24 @@ class homePage extends Component {
tgrData1,
} = this.props;
const loginChange = () => {
return actionList?.loginNum - actionList?.loginPreNum > 0 ? (
return dllData.num - dllData.preNum > 0 ? (
<>
较昨日上升
较{this.state.oldCurrentPeriod}上升
<img className={styles.icon} src={up} alt="" />
<span style={{ color: "#d26f64" }}>
{actionList?.loginNum - actionList?.loginPreNum} 人
{dllData.num - dllData.preNum} 人
</span>
</>
) : actionList?.loginNum - actionList?.loginPreNum < 0 ? (
) : dllData.num - dllData.preNum < 0 ? (
<>
较昨日下降
较{this.state.oldCurrentPeriod}下降
<img className={styles.icon} src={down} alt="" />
<span style={{ color: "#70bb74" }}>
{actionList?.loginPreNum - actionList?.loginNum} 人
{dllData.preNum - dllData.num} 人
</span>
</>
) : (
<>较昨日不变</>
<>较{this.state.oldCurrentPeriod}不变</>
);
};
const readChange = () => {
......@@ -839,7 +857,7 @@ class homePage extends Component {
const admireChange = () => {
return actionList?.admireNum - actionList?.admirePreNum > 0 ? (
<>
较昨日上升
较{this.state.oldHdlCurrentPeriod}上升
<img className={styles.icon} src={up} alt="" />
<span style={{ color: "#d26f64" }}>
{actionList?.admireNum - actionList?.admirePreNum} 人
......@@ -847,14 +865,14 @@ class homePage extends Component {
</>
) : actionList?.admireNum - actionList?.admirePreNum < 0 ? (
<>
较昨日下降
较{this.state.oldHdlCurrentPeriod}下降
<img className={styles.icon} src={down} alt="" />
<span style={{ color: "#70bb74" }}>
{actionList?.admirePreNum - actionList?.admireNum} 人
</span>
</>
) : (
<>较昨日不变</>
<>较{this.state.oldHdlCurrentPeriod}不变</>
);
};
const phbHtml = () => {
......@@ -907,21 +925,21 @@ class homePage extends Component {
{/* 顶部四个栏目 */}
<div className={styles.row1}>
<div className={styles.card}>
<p>今日登录量（人）</p>
<p>{this.state.currentPeriod}登录量（人）</p>
<p>
<span>{actionList?.loginNum} </span>
<span>{dllData.num} </span>
{loginChange()}
</p>
</div>
<div className={styles.card2}>
<p>今日板块浏览量（人）</p>
<p>今日浏览量（人）</p>
<p>
<span>{actionList?.readNum} </span>
{readChange()}
</p>
</div>
<div className={styles.card3}>
<p>今日登党务直通收藏量（人）</p>
<p>{this.state.hdlcurrentPeriod}互动量（人）</p>
<p>
<span>{actionList?.admireNum} </span>
{admireChange()}
......@@ -950,17 +968,14 @@ class homePage extends Component {
this.dllChange(e);
}}
>
<Option value={1} key={1}>
年度
<Option value={3} key={1}>
今日
</Option>
<Option value={2} key={2}>
月度
</Option>
<Option value={3} key={3}>
今日
</Option>
<Option value={4} key={4}>
本周
<Option value={1} key={3}>
年度
</Option>
</Select>
</div>
......@@ -992,17 +1007,14 @@ class homePage extends Component {
this.lllChange(e);
}}
>
<Option value={1} key={1}>
年度
<Option value={3} key={1}>
今日
</Option>
<Option value={2} key={2}>
月度
</Option>
<Option value={3} key={3}>
今日
</Option>
<Option value={4} key={4}>
本周
<Option value={1} key={3}>
年度
</Option>
</Select>
</div>
......@@ -1041,17 +1053,14 @@ class homePage extends Component {
this.hdlChange(1, e);
}}
>
<Option value={1} key={1}>
年度
<Option value={3} key={1}>
今日
</Option>
<Option value={2} key={2}>
月度
</Option>
<Option value={3} key={3}>
今日
</Option>
<Option value={4} key={4}>
本周
<Option value={1} key={3}>
年度
</Option>
</Select>
<Select
......@@ -1061,7 +1070,7 @@ class homePage extends Component {
this.hdlChange(2, e);
}}
>
<Option value={15} key={1}>
<Option value={6} key={1}>
阅读
</Option>
<Option value={11} key={2}>
......@@ -1127,17 +1136,14 @@ class homePage extends Component {
this.phbChange(2, e);
}}
>
<Option value={1} key={1}>
年度
<Option value={3} key={1}>
今日
</Option>
<Option value={2} key={2}>
月度
</Option>
<Option value={3} key={3}>
日
</Option>
<Option value={4} key={4}>
周
<Option value={1} key={3}>
年度
</Option>
</Select>
</div>
......@@ -1165,7 +1171,7 @@ class homePage extends Component {
<div>
<div>
<img src={img5} alt="" />
<p>近一个季度各支部活动报名、签到及评论总数</p>
<p>各支部活动报名、签到、评论以及发起总数</p>
</div>
{zllData &&
zllData.length > 0 &&
......@@ -1208,6 +1214,11 @@ class homePage extends Component {
<span className={styles.yellow}></span>
<span>签到总数</span>
</p>
<p>
{" "}
<span className={styles.red}></span>
<span>发起总数</span>
</p>
</div>
{zllData &&
zllData.length > 0 &&
......@@ -1311,9 +1322,6 @@ class homePage extends Component {
<Option value={3} key={3}>
今日
</Option>
<Option value={4} key={4}>
本周
</Option>
</Select>
</div>
</div>
......
src/pages/Dashboard/style/index.css
......@@ -26,7 +26,7 @@
background: white;
border-radius: 5px;
padding: 20px 15px;
width: 1210px;
width: 100%;
}
.box :global .ant-select-selection--single {
height: 25px !important;
......@@ -39,24 +39,24 @@
justify-content: space-between;
}
.box .row1 .card {
width: 285px;
width: 23.5%;
height: 100px;
background: url("../imgs/1.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card p:nth-child(1) {
color: white;
font-size: 14px;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
.box .row1 .card p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
margin-left: 88px;
color: white;
font-size: 10px;
font-size: 12px;
}
.box .row1 .card p:nth-child(2) span:nth-child(1) {
color: white;
......@@ -65,24 +65,24 @@
margin-left: 10px;
}
.box .row1 .card2 {
width: 285px;
width: 23.5%;
height: 100px;
background: url("../imgs/2.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card2 p:nth-child(1) {
color: white;
font-size: 14px;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
.box .row1 .card2 p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
margin-left: 88px;
color: white;
font-size: 10px;
font-size: 12px;
}
.box .row1 .card2 p:nth-child(2) span:nth-child(1) {
color: white;
......@@ -91,24 +91,24 @@
margin-left: 10px;
}
.box .row1 .card3 {
width: 285px;
width: 23.5%;
height: 100px;
background: url("../imgs/3.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card3 p:nth-child(1) {
color: white;
font-size: 14px;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
.box .row1 .card3 p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
margin-left: 88px;
color: white;
font-size: 10px;
font-size: 12px;
}
.box .row1 .card3 p:nth-child(2) span:nth-child(1) {
color: white;
......@@ -117,24 +117,24 @@
margin-left: 10px;
}
.box .row1 .card4 {
width: 285px;
width: 23.5%;
height: 100px;
background: url("../imgs/12.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card4 p:nth-child(1) {
color: white;
font-size: 14px;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
.box .row1 .card4 p:nth-child(2) {
margin: 0;
margin-top: 15px;
margin-left: 80px;
margin-left: 100px;
color: white;
font-size: 10px;
font-size: 12px;
}
.box .row1 .card4 p:nth-child(2) span:nth-child(1) {
color: white;
......@@ -148,7 +148,7 @@
justify-content: space-between;
}
.box .row2 .chart1 {
width: 285px;
width: 23.5%;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) {
display: flex;
......@@ -179,16 +179,16 @@
align-items: center;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
width: 100px;
}
.box .row2 .chart1 .chartBottom {
width: 285px;
width: 100%;
height: 355px;
margin-top: -30px;
margin-bottom: -30px;
}
.box .row2 .chart2 {
width: 285px;
width: 23.5%;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) {
display: flex;
......@@ -218,16 +218,16 @@
align-items: center;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
width: 100px;
}
.box .row2 .chart2 .chartBottom {
width: 285px;
width: 100%;
min-height: 270px;
margin-top: 21px;
}
.box .row2 .chart2 .chartBottom .lllBox {
width: 100%;
height: 17px;
height: 20px;
margin-bottom: 8px;
display: flex;
align-items: center;
......@@ -236,8 +236,8 @@
.box .row2 .chart2 .chartBottom .lllBox p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 50px;
height: 17px;
width: 18%;
height: 20px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
......@@ -246,15 +246,15 @@
text-overflow: ellipsis;
}
.box .row2 .chart2 .chartBottom .lllBox > div:nth-child(2) {
height: 6px;
width: 210px;
height: 8px;
width: 80%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box .row2 .chart2 .chartBottom .lllBox > div:nth-child(2) .process {
display: block;
height: 6px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
......@@ -269,7 +269,7 @@
text-align: right;
}
.box .row2 .chart3 {
width: 285px;
width: 23.5%;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) {
display: flex;
......@@ -300,19 +300,19 @@
align-items: center;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 65px;
width: 70px;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(2) .Select:nth-child(3) {
width: 80px;
width: 100px;
}
.box .row2 .chart3 .chartBottom {
width: 285px;
width: 100%;
height: 355px;
margin-top: -30px;
margin-bottom: -30px;
}
.box .row2 .chart4 {
width: 285px;
width: 23.5%;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) {
display: flex;
......@@ -342,15 +342,15 @@
align-items: center;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
width: 100px;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(2) .Select:nth-child(1) {
margin-right: 10px;
}
.box .row2 .chart4 .chartBottom {
width: 100%;
height: 228px;
margin-top: 20px;
width: 285px;
}
.box .row2 .chart4 .chartBottom p {
margin: 0;
......@@ -359,7 +359,7 @@
display: flex;
justify-content: space-between;
align-items: center;
background: #F5F6F7;
background: #f5f6f7;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
font-weight: 400;
......@@ -413,7 +413,7 @@
text-align: right;
}
.box1 {
width: 1210px;
width: 100%;
}
.box1 :global .ant-select-selection--single {
height: 25px !important;
......@@ -428,7 +428,43 @@
}
.box1 .row1 > div:nth-child(1) {
padding: 20px 15px;
width: 700px;
width: 57.85%;
}
.box1 .row1 > div:nth-child(2) {
padding: 20px 15px;
width: 40.91%;
}
.box1 .row2 {
display: flex;
justify-content: space-between;
margin-top: 12px;
height: 460px;
}
.box1 .row2 > div:nth-child(1) {
padding: 20px 15px;
width: 25%;
}
.box1 .row2 > div:nth-child(2) {
width: 75%;
}
.box1 > div:nth-child(2) {
display: flex;
justify-content: space-between;
}
.box1 > div:nth-child(2) > .tgchart {
width: 45%;
}
.box1 > div:nth-child(2) > .lineData {
width: 53%;
}
.box1 .row1 {
display: flex;
justify-content: space-between;
height: 500px;
}
.box1 .row1 > div:nth-child(1) {
padding: 20px 15px;
width: 55%;
background: white;
border-radius: 5px;
}
......@@ -452,7 +488,7 @@
}
.box1 .row1 > div:nth-child(1) > .zllBox {
width: 100%;
height: 45px;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
......@@ -460,9 +496,9 @@
.box1 .row1 > div:nth-child(1) > .zllBox p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 150px;
height: 45px;
line-height: 45px;
width: 18%;
height: 56px;
line-height: 56px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
......@@ -470,24 +506,24 @@
padding: 0 15px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) {
width: 520px;
width: 80%;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
height: 14px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) {
height: 7px;
width: 540px;
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
......@@ -505,18 +541,18 @@
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
height: 14px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) {
height: 7px;
width: 540px;
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
......@@ -534,18 +570,18 @@
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
height: 14px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) > div:nth-child(1) {
height: 7px;
width: 540px;
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) > div:nth-child(1) .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
......@@ -559,8 +595,37 @@
color: #8b8ba7;
text-align: right;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(4) {
display: flex;
align-items: center;
justify-content: space-between;
height: 14px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(4) > div:nth-child(1) {
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(4) > div:nth-child(1) .process {
display: block;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg, #ba4048 0%, #e22020 100%);
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(4) > p {
margin: 0;
width: 40px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 {
margin-top: 21px;
margin-top: 12px;
display: flex;
align-items: center;
justify-content: space-between;
......@@ -577,11 +642,14 @@
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 .yellow {
background: linear-gradient(270deg, #f59a23 0%, #fece8f);
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 .red {
background: linear-gradient(270deg, #ba4048 0%, #e22020);
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > div {
background: #f5f6f7;
height: 26px;
height: 24px;
opacity: 0.7;
line-height: 26px;
line-height: 24px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
......@@ -593,8 +661,8 @@
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > p {
margin: 0;
height: 30px;
line-height: 30px;
height: 24px;
line-height: 24px;
display: flex;
align-items: center;
justify-content: center;
......@@ -618,7 +686,7 @@
line-height: 30px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum {
width: 120px;
width: 100px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum > div {
background: #f5f6f7;
......@@ -636,8 +704,8 @@
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum > p {
margin: 0;
height: 30px;
line-height: 30px;
height: 24px;
line-height: 24px;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
......@@ -646,7 +714,7 @@
}
.box1 .row1 > div:nth-child(2) {
padding: 20px 15px;
width: 495px;
width: 43%;
background: white;
border-radius: 5px;
}
......@@ -698,7 +766,7 @@
}
.box1 .row2 > div:nth-child(1) {
padding: 20px 15px;
width: 240px;
width: 18%;
background: white;
border-radius: 5px;
}
......@@ -756,7 +824,7 @@
margin: 0;
}
.box1 .row2 > div:nth-child(2) {
width: 955px;
width: 80%;
padding: 20px 15px;
background: white;
border-radius: 5px;
......@@ -784,7 +852,7 @@
justify-content: space-between;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart {
width: 220px;
width: 36%;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) {
display: flex;
......@@ -816,10 +884,10 @@
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
width: 100px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart .chartBottom {
width: 220px;
width: 100%;
height: 420px;
margin-top: -30px;
margin-bottom: -30px;
......@@ -829,7 +897,7 @@
background: #e7e7e7;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData {
width: 680px;
width: 60%;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) {
display: flex;
......@@ -861,10 +929,10 @@
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
width: 100px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData .chartBottom {
width: 680px;
width: 100%;
height: 200px;
margin-top: 10px;
margin-bottom: -30px;
......
src/pages/Dashboard/style/index.less
.background{
.background {
background: #f8f9ff;
padding: 20px 15px;
}
.icon{
.icon {
width: 11px;
height: 11px;
margin-bottom: 1px;
margin-left: 2px;
}
.titles{
.titles {
display: flex;
justify-items: center;
align-items: center;
& img{
& img {
width: 24px;
height: 24px;
margin-right: 8px;
......@@ -23,9 +22,9 @@
font-weight: 500;
color: #1c1f37;
}
.box{
:global{
.ant-select-selection--single{
.box {
:global {
.ant-select-selection--single {
height: 25px !important;
}
.ant-select-selection__rendered {
......@@ -35,138 +34,137 @@
background: white;
border-radius: 5px;
padding: 20px 15px;
width: 1210px;
.row1{
width: 100%;
.row1 {
display: flex;
justify-content: space-between;
.card{
width: 285px;
.card {
width: 23.5%;
height: 100px;
background: url("../imgs/1.png") no-repeat;
background-size: 100% 100%;
& p:nth-child(1){
color:white;
font-size: 14px;
& p:nth-child(1) {
color: white;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
& p:nth-child(2){
& p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
& span:nth-child(1){
color:white;
margin-left: 88px;
& span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
color:white;
font-size: 10px;
color: white;
font-size: 12px;
}
}
.card2{
width: 285px;
.card2 {
width: 23.5%;
height: 100px;
background: url("../imgs/2.png") no-repeat;
background-size: 100% 100%;
& p:nth-child(1){
color:white;
font-size: 14px;
& p:nth-child(1) {
color: white;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
& p:nth-child(2){
& p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
& span:nth-child(1){
color:white;
margin-left: 88px;
& span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
color:white;
font-size: 10px;
color: white;
font-size: 12px;
}
}
.card3{
width: 285px;
.card3 {
width: 23.5%;
height: 100px;
background: url("../imgs/3.png") no-repeat;
background-size: 100% 100%;
& p:nth-child(1){
color:white;
font-size: 14px;
& p:nth-child(1) {
color: white;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
& p:nth-child(2){
& p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
& span:nth-child(1){
color:white;
margin-left: 88px;
& span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
color:white;
font-size: 10px;
color: white;
font-size: 12px;
}
}
.card4{
width: 285px;
.card4 {
width: 23.5%;
height: 100px;
background: url("../imgs/12.png") no-repeat;
background-size: 100% 100%;
& p:nth-child(1){
color:white;
font-size: 14px;
& p:nth-child(1) {
color: white;
font-size: 16px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
margin-left: 100px;
}
& p:nth-child(2){
& p:nth-child(2) {
margin: 0;
margin-top: 15px;
margin-left: 80px;
& span:nth-child(1){
color:white;
margin-left: 100px;
& span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
color:white;
font-size: 10px;
color: white;
font-size: 12px;
}
}
}
.row2{
}
.row2 {
margin-top: 15px;
display: flex;
justify-content: space-between;
& .chart1{
width: 285px;
& .chartTop{
& > div:nth-child(1){
& .chart1 {
width: 23.5%;
& .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -174,19 +172,19 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
& .Select{
width: 80px;
& .Select {
width: 100px;
}
}
}
}
& .chartBottom{
width: 285px;
& .chartBottom {
width: 100%;
height: 355px;
// background: url('../imgs/a1.png') no-repeat;
// background-size: 100% 100%;
......@@ -194,23 +192,23 @@
margin-bottom: -30px;
}
}
& .chart2{
width: 285px;
& .chartTop{
& > div:nth-child(1){
& .chart2 {
width: 23.5%;
& .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -218,58 +216,62 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
justify-content: center;
align-items: center;
& .Select{
width: 80px;
& .Select {
width: 100px;
}
}
}
}
& .chartBottom{
width: 285px;
& .chartBottom {
width: 100%;
min-height: 270px;
// background: url('../imgs/a2.png') no-repeat;
// background-size: 100% 100%;
margin-top: 21px;
& .lllBox{
& .lllBox {
width: 100%;
height: 17px;
height: 20px;
margin-bottom: 8px;
display: flex;
align-items: center;
justify-content: space-between;
& p:nth-child(1){
& p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 50px;
height: 17px;
border-right:1px dashed #c5c5d3 ;
width: 18%;
height: 20px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
& > div:nth-child(2){
height: 6px;
width: 210px;
& > div:nth-child(2) {
height: 8px;
width: 80%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
& .process{
& .process {
display: block;
height: 6px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(180deg,#8675ff, #8386ff 51%, #75ccff 100%);
background: linear-gradient(
180deg,
#8675ff,
#8386ff 51%,
#75ccff 100%
);
}
}
& p:nth-child(3){
& p:nth-child(3) {
margin: 0;
width: 20px;
font-size: 12px;
......@@ -280,23 +282,23 @@
}
}
}
& .chart3{
width: 285px;
& .chartTop{
& > div:nth-child(1){
& .chart3 {
width: 23.5%;
& .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -304,46 +306,44 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
z-index: 1;
justify-content: center;
align-items: center;
& .Select{
width: 65px;
& .Select {
width: 70px;
}
& .Select:nth-child(3){
width: 80px;
& .Select:nth-child(3) {
width: 100px;
}
}
}
}
& .chartBottom{
width: 285px;
& .chartBottom {
width: 100%;
height: 355px;
margin-top: -30px;
margin-bottom: -30px;
}
}
& .chart4{
width: 285px;
& .chartTop{
& > div:nth-child(1){
& .chart4 {
width: 23.5%;
& .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -351,62 +351,66 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
justify-content: center;
align-items: center;
& .Select{
width: 80px;
& .Select {
width: 100px;
}
& .Select:nth-child(1){
& .Select:nth-child(1) {
margin-right: 10px;
}
}
}
}
& .chartBottom{
width: 285px;
& .chartBottom {
width: 100%;
height: 228px;
margin-top: 20px;
& p{margin: 0;}
width: 285px;
& > .title{
& p {
margin: 0;
}
& > .title {
display: flex;
justify-content: space-between;
align-items: center;
background: #F5F6F7;
background: #f5f6f7;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
font-weight: 400;
color: rgba(74,81,84,.7);
color: rgba(74, 81, 84, 0.7);
padding: 6px 12px;
margin-bottom: 15px;
& p:nth-child(1){
& p:nth-child(1) {
width: 20%;
text-align: left;
}
& p:nth-child(2){
& p:nth-child(2) {
width: 60%;
text-align: center;
}
& p:nth-child(3){
& p:nth-child(3) {
width: 20%;
text-align: right;
}
}
& > .list{
& > .list {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 18px;
font-size: 14px;
color: rgba(74,81,84,1);
color: rgba(74, 81, 84, 1);
& p:nth-child(1){
& p:nth-child(1) {
width: 20%;
& > img{width: 30px; height: 30px; display: block;}
& .p{
& > img {
width: 30px;
height: 30px;
display: block;
}
& .p {
font-size: 14px;
width: 30px;
display: block;
......@@ -417,52 +421,93 @@
}
}
& p:nth-child(2){
& p:nth-child(2) {
width: 60%;
text-align: center;
}
& p:nth-child(3){
& p:nth-child(3) {
width: 20%;
text-align: right;
}
}
}
}
}
}
}
.box1{
:global{
.ant-select-selection--single{
.box1 {
:global {
.ant-select-selection--single {
height: 25px !important;
}
.ant-select-selection__rendered {
line-height: 25px !important;
}
}
& .row1 {
display: flex;
justify-content: space-between;
height: 460px;
& > div:nth-child(1) {
padding: 20px 15px;
width: 57.85%; // 将固定700px改为百分比 (700/1210)
// ... existing code ...
}
& > div:nth-child(2) {
padding: 20px 15px;
width: 40.91%; // 将固定495px改为百分比 (495/1210)
// ... existing code ...
}
}
width: 1210px;
& .row1{
& .row2 {
display: flex;
justify-content: space-between;
margin-top: 12px;
height: 460px;
& > div:nth-child(1){
& > div:nth-child(1) {
padding: 20px 15px;
width: 25%; // 将固定240px改为百分比 (240/1210)
// ... existing code ...
}
& > div:nth-child(2) {
width: 75%; // 将固定955px改为百分比 (955/1210)
// ... existing code ...
}
}
& > div:nth-child(2) {
display: flex;
justify-content: space-between;
& > .tgchart {
width: 45%; // 将固定380px改为百分比 (380/845)
// ... existing code ...
}
& > .lineData {
width: 53%; // 将固定580px改为百分比 (580/845)
// ... existing code ...
}
}
width: 100%;
& .row1 {
display: flex;
justify-content: space-between;
height: 500px;
& > div:nth-child(1) {
padding: 20px 15px;
width: 700px;
width: 55%;
background: white;
border-radius: 5px;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -470,47 +515,47 @@
color: #4a5154;
}
}
& > .zllBox{
& > .zllBox {
width: 100%;
height: 45px;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
& p:nth-child(1){
& p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 150px;
height: 45px;
line-height: 45px;
border-right:1px dashed #c5c5d3 ;
width: 18%;
height: 56px;
line-height: 56px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
padding: 0 15px;
}
& > div:nth-child(2){
width:520px;
& > div:nth-child(1){
& > div:nth-child(2) {
width: 80%;
& > div:nth-child(1) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
& > div:nth-child(1){
height: 7px;
width: 540px;
height: 14px;
& > div:nth-child(1) {
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
& .process{
& .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg,#17c77b 0%, #6ce671 100%);
background: linear-gradient(-90deg, #17c77b 0%, #6ce671 100%);
}
}
& > p{
& > p {
margin: 0;
width: 30px;
font-size: 12px;
......@@ -519,27 +564,27 @@
text-align: right;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
& > div:nth-child(1){
height: 7px;
width: 540px;
height: 14px;
& > div:nth-child(1) {
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
& .process{
& .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg,#34b9f3 0%, #a3e3ff 100%);
background: linear-gradient(-90deg, #34b9f3 0%, #a3e3ff 100%);
}
}
& > p{
& > p {
margin: 0;
width: 30px;
font-size: 12px;
......@@ -548,27 +593,27 @@
text-align: right;
}
}
& > div:nth-child(3){
& > div:nth-child(3) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
& > div:nth-child(1){
height: 7px;
width: 540px;
height: 14px;
& > div:nth-child(1) {
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
& .process{
& .process {
display: block;
height: 7px;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg,#f59a23 0%, #fece8f 100%);
background: linear-gradient(-90deg, #f59a23 0%, #fece8f 100%);
}
}
& > p{
& > p {
margin: 0;
width: 30px;
font-size: 12px;
......@@ -577,54 +622,85 @@
text-align: right;
}
}
& > div:nth-child(4) {
display: flex;
align-items: center;
justify-content: space-between;
height: 14px;
& > div:nth-child(1) {
height: 8px;
width: 100%;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
& .process {
display: block;
height: 8px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg, #ba4048 0%, #e22020 100%);
}
}
& > .zllbox2{
margin-top: 21px;
& > p {
margin: 0;
width: 40px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
}
}
}
& > .zllbox2 {
margin-top: 12px;
display: flex;
align-items: center;
justify-content: space-between;
& > .zllNum1{
& > .zllNum1 {
width: 100px;
& .green{
background: linear-gradient(270deg,#17c77b 0%, #6ce671);
& .green {
background: linear-gradient(270deg, #17c77b 0%, #6ce671);
}
& .blue {
background: linear-gradient(270deg, #34b9f3 0%, #a3e3ff);
}
& .blue{
background: linear-gradient(270deg,#34b9f3 0%, #a3e3ff);
& .yellow {
background: linear-gradient(270deg, #f59a23 0%, #fece8f);
}
& .yellow{
background: linear-gradient(270deg,#f59a23 0%, #fece8f);
& .red {
background: linear-gradient(270deg, #ba4048 0%, #e22020);
}
& > div{
& > div {
background: #f5f6f7;
height: 26px;
height: 24px;
opacity: 0.7;
line-height: 26px;
line-height: 24px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 12px;
}
& > p{
& > p {
margin: 0;
height: 30px;
line-height: 30px;
height: 24px;
line-height: 24px;
display: flex;
align-items: center;
justify-content: center;
& > span:nth-child(1){
& > span:nth-child(1) {
height: 8px;
width: 8px;
border-radius: 50%;
display: block;
margin-right: 5px;
}
& > p:nth-child(2){
& > p:nth-child(2) {
display: block;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
......@@ -635,12 +711,11 @@
height: 30px;
line-height: 30px;
}
}
}
& > .zllNum{
width: 120px;
& > div{
& > .zllNum {
width: 100px;
& > div {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
......@@ -649,15 +724,15 @@
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 12px;
}
& > p{
& > p {
margin: 0;
height: 30px;
line-height: 30px;
height: 24px;
line-height: 24px;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
......@@ -668,22 +743,22 @@
}
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
padding: 20px 15px;
width: 495px;
width: 43%;
background: white;
border-radius: 5px;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -691,13 +766,13 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
align-items: center;
justify-content: space-between;
& > .chartList{
& > .chartList {
width: 50%;
& >p{
& > p {
margin: 0;
text-align: center;
font-size: 14px;
......@@ -705,7 +780,7 @@
font-weight: 500;
color: #8b8ba7;
}
& > .chartBottom{
& > .chartBottom {
width: 250px;
height: 400px;
margin-top: -10px;
......@@ -715,27 +790,27 @@
}
}
}
& .row2{
& .row2 {
display: flex;
justify-content: space-between;
margin-top: 12px;
height: 460px;
& > div:nth-child(1){
& > div:nth-child(1) {
padding: 20px 15px;
width: 240px;
width: 18%;
background: white;
border-radius: 5px;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 38px;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -743,35 +818,34 @@
color: #4a5154;
}
}
& > .questionBox{
& > .questionBox {
width: 190px;
background: #f3f6f9;
border-radius: 4px;
box-shadow: 0px 2.5px 5px 0px #f1f2fa;
margin: 0 auto 38px;
padding: 26px 22px;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto 6px;
width: 100px;
& > p:nth-child(1){
& > p:nth-child(1) {
margin: 0;
width: 40px;
height: 40px;
background: url("../imgs/14.png") no-repeat;
}
& > p:nth-child(2){
& > p:nth-child(2) {
margin: 0;
font-size: 28px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #8b8ba7;
}
}
& > p:nth-child(2){
& > p:nth-child(2) {
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
......@@ -780,22 +854,22 @@
}
}
}
& > div:nth-child(2){
width: 955px;
& > div:nth-child(2) {
width: 80%;
padding: 20px 15px;
background: white;
border-radius: 5px;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
......@@ -803,26 +877,26 @@
color: #4a5154;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
display: flex;
justify-content: space-between;
& > .tgchart{
width: 220px;
& > .chartTop{
& > div:nth-child(1){
& > .tgchart {
width: 36%;
& > .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 14px;
font-family: PingFang SC, PingFang SC-600;
......@@ -831,19 +905,19 @@
color: #8b8ba7;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
& .Select{
width: 80px;
& .Select {
width: 100px;
}
}
}
}
& .chartBottom{
width: 220px;
& .chartBottom {
width: 100%;
height: 420px;
// background: url('../imgs/a1.png') no-repeat;
// background-size: 100% 100%;
......@@ -851,27 +925,27 @@
margin-bottom: -30px;
}
}
& > .line{
& > .line {
width: 1px;
background: #e7e7e7;
}
& > .lineData{
width: 680px;
& > .chartTop{
& > div:nth-child(1){
& > .lineData {
width: 60%;
& > .chartTop {
& > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
& > div:nth-child(1){
& > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
&> img{
& > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
&> p{
& > p {
margin: 0;
font-size: 14px;
font-family: PingFang SC, PingFang SC-600;
......@@ -880,40 +954,40 @@
color: #8b8ba7;
}
}
& > div:nth-child(2){
& > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
& .Select{
width: 80px;
& .Select {
width: 100px;
}
}
}
}
& .chartBottom{
width: 680px;
& .chartBottom {
width: 100%;
height: 200px;
margin-top: 10px;
margin-bottom: -30px;
}
& > .zllbox2{
& > .zllbox2 {
margin-top: 18px;
display: flex;
align-items: center;
justify-content: space-between;
& > .zllNum1{
& > .zllNum1 {
width: 180px;
& .green{
background: linear-gradient(270deg,#17c77b 0%, #6ce671);
& .green {
background: linear-gradient(270deg, #17c77b 0%, #6ce671);
}
& .blue{
background: linear-gradient(270deg,#34b9f3 0%, #a3e3ff);
& .blue {
background: linear-gradient(270deg, #34b9f3 0%, #a3e3ff);
}
& .yellow{
background: linear-gradient(270deg,#f59a23 0%, #fece8f);
& .yellow {
background: linear-gradient(270deg, #f59a23 0%, #fece8f);
}
& > p{
& > p {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
......@@ -922,12 +996,12 @@
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 4px;
}
& > div{
& > div {
margin: 0;
height: 26px;
line-height: 26px;
......@@ -935,14 +1009,14 @@
align-items: center;
justify-content: flex-start;
padding-left: 22px;
& > span:nth-child(1){
& > span:nth-child(1) {
height: 8px;
width: 8px;
border-radius: 50%;
display: block;
margin-right: 5px;
}
& > span:nth-child(2){
& > span:nth-child(2) {
display: block;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
......@@ -953,12 +1027,11 @@
height: 30px;
line-height: 30px;
}
}
}
& > .zllNum{
& > .zllNum {
width: 125px;
& > div{
& > div {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
......@@ -967,12 +1040,12 @@
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 4px;
}
& > p{
& > p {
margin: 0;
height: 26px;
line-height: 26px;
......@@ -989,5 +1062,4 @@
}
}
}
}
src/pages/SystemManagement/Article/addEditForm.jsx
......@@ -281,7 +281,7 @@ class addEdit extends React.Component {
label={"封面logo"}
extra={
<div style={{ marginLeft: "164px" }}>
请上传资源附件（支持格式jpeg、jpg、png，大小20m以内）建议尺寸：1125*900
请上传资源附件（支持格式jpeg、jpg、png）建议尺寸：1125*900
</div>
}
>
......
src/pages/SystemManagement/Information/addEditForm.jsx
......@@ -345,7 +345,7 @@ class addEdit extends React.Component {
label={"封面logo"}
extra={
<div style={{ marginLeft: "164px" }}>
请上传资源附件（支持格式jpeg、jpg、png，大小20m以内）建议尺寸：1125*900
请上传资源附件（支持格式jpeg、jpg、png）建议尺寸：1125*900
</div>
}
>
......
src/pages/SystemManagement/Site/Door/indexPage/mobilePlugin/Ass/index.jsx
......@@ -163,7 +163,7 @@ class Community extends Component {
preRatio={["355/100"]}
maxSize={20 * 1024 * 1024}
disabled={this.state.flag}
extra="请上传资源附件（支持格式jpeg、jpg、png，大小20M以内，最佳尺寸：355*100）"
extra="请上传资源附件（支持格式jpeg、jpg、png，最佳尺寸：355*100）"
/>
{/* <span>上传</span> */}
</div>
......
src/pages/SystemManagement/Site/Door/pcIndex/component/toolEdit/ToolEdit.jsx
......@@ -616,7 +616,7 @@ class ToolEdit extends Component {
terminalId={this.props.terminalId}
moduleId={this.props.moduleId}
dataList={this.props.pcReducer["m" + this.props.moduleId]}
isPc={true}
/>
)}
{/*培训项目/课程/讲师库*/}
......@@ -678,7 +678,7 @@ class ToolEdit extends Component {
preRatio={["1200/170"]}
maxSize={20 * 1024 * 1024}
// disabled={this.state.flag}
extra="请上传资源附件（支持格式jpeg、jpg、png，大小20M以内，最佳尺寸：1200*170）"
extra="请上传资源附件（支持格式jpeg、jpg、png，最佳尺寸：1200*170）"
/>
{/* <span>上传</span> */}
</div>
......
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