Skip to content

S
sass-admin
Commit f7d999b5 by end
Options

修复工作台bug

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