This commit is contained in:
caishi 2023-02-03 22:06:04 +08:00
parent de90b52719
commit fca26ba79b
3 changed files with 155 additions and 8 deletions

View File

@ -1,5 +1,5 @@
import React from 'react';
import { Checkbox } from 'antd';
import { Checkbox , Tooltip } from 'antd';
import issue from '../Img/issue.png';
// issue
@ -17,7 +17,7 @@ function Datas(){
<div className="idetails">
<img src={issue} alt="" width="16px" className="mr5" />
<p>如何参与到项目的开发提升技术能力</p>
<span style={{color: "#ee955a"}}><i className="iconfont icon-biaoji mr3 font-12"></i>invalid</span>
<Tooltip title="点击复制链接" placement="bottom"><span style={{color: "#ee955a"}}><i className="iconfont icon-biaoji mr3 font-12"></i>invalid</span></Tooltip>
</div>
<div className="infos">
<img src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
@ -28,15 +28,116 @@ function Datas(){
</div>
</div>
</div>
<div className="issuecondition"></div>
<div className="issuecondition">
<div className="principal">
<img style={{right:`${5*(20-7)}px`,zIndex:1}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${4*(20-7)}px`,zIndex:2}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${3*(20-7)}px`,zIndex:3}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${2*(20-7)}px`,zIndex:4}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${20-7}px`,zIndex:5}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<span>...</span>
</div>
<div>正在解决</div>
<div className="commentnum"><i className="iconfont icon-a-xiaoxi1 mr5 font-15"></i>10</div>
</div>
</div>
<div>
<div></div>
<div></div>
<div className="issuedetail">
<Checkbox style={{marginRight: "16px"}} value="0"></Checkbox>
<div className="ilog">
<span className="status urgent">紧急</span>
<span className="number">#2</span>
</div>
<div style={{marginTop:"-2px"}}>
<div className="idetails">
<img src={issue} alt="" width="16px" className="mr5" />
<p>如何参与到项目的开发提升技术能力</p>
<Tooltip title="点击复制链接" placement="bottom"><span style={{color: "#009a43"}}><i className="iconfont icon-biaoji mr3 font-12"></i>test</span></Tooltip>
</div>
<div className="infos">
<img src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<span className="mr20">张嘉佳</span>
<span className="mr25">2022/11/25 15:25 发布</span>
<span className="mr50">2022/11/29 15:25更新</span>
<span><i className="iconfont icon-lichengbeiicon1 font-12 mr2"></i>里程碑名称标题</span>
</div>
</div>
</div>
<div className="issuecondition">
<div className="principal">
<img style={{right:`${4*20}px`,zIndex:1}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${3*20}px`,zIndex:2}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${2*20}px`,zIndex:3}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${1*20}px`,zIndex:4}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${0*20}px`,zIndex:5}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
</div>
<div>拒绝</div>
<div className="commentnum"><i className="iconfont icon-a-xiaoxi1 mr5 font-15"></i>10</div>
</div>
</div>
<div>
<div></div>
<div></div>
<div className="issuedetail">
<Checkbox style={{marginRight: "16px"}} value="0"></Checkbox>
<div className="ilog">
<span className="status hight"></span>
<span className="number">#3</span>
</div>
<div style={{marginTop:"-2px"}}>
<div className="idetails">
<img src={issue} alt="" width="16px" className="mr5" />
<p>如何参与到项目的开发提升技术能力</p>
<Tooltip title="点击复制链接" placement="bottom"><span style={{color: "#c1a30d"}}><i className="iconfont icon-biaoji mr3 font-12"></i>feature</span></Tooltip>
</div>
<div className="infos">
<img src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<span className="mr20">张嘉佳</span>
<span className="mr25">2022/11/25 15:25 发布</span>
<span className="mr50">2022/11/29 15:25更新</span>
<span><i className="iconfont icon-lichengbeiicon1 font-12 mr2"></i>里程碑名称标题</span>
</div>
</div>
</div>
<div className="issuecondition">
<div className="principal">
<img style={{right:`${2*20}px`,zIndex:3}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${1*20}px`,zIndex:4}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${0*20}px`,zIndex:5}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
</div>
<div>反馈</div>
<div className="commentnum"><i className="iconfont icon-a-xiaoxi1 mr5 font-15"></i>10</div>
</div>
</div>
<div>
<div className="issuedetail">
<Checkbox style={{marginRight: "16px"}} value="0"></Checkbox>
<div className="ilog">
<span className="status low"></span>
<span className="number">#3</span>
</div>
<div style={{marginTop:"-2px"}}>
<div className="idetails">
<img src={issue} alt="" width="16px" className="mr5" />
<p>如何参与到项目的开发提升技术能力</p>
<Tooltip title="点击复制链接" placement="bottom"><span style={{color: "#c1a30d"}}><i className="iconfont icon-biaoji mr3 font-12"></i>feature</span></Tooltip>
</div>
<div className="infos">
<img src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<span className="mr20">张嘉佳</span>
<span className="mr25">2022/11/25 15:25 发布</span>
<span className="mr50">2022/11/29 15:25更新</span>
<span><i className="iconfont icon-lichengbeiicon1 font-12 mr2"></i>里程碑名称标题</span>
</div>
</div>
</div>
<div className="issuecondition">
<div className="principal">
<img style={{right:`${2*20}px`,zIndex:3}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${1*20}px`,zIndex:4}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
<img style={{right:`${0*20}px`,zIndex:5}} src={"https://testforgeplus.trustie.net/images/avatars/User/36480?t=1672730523"} alt="" />
</div>
<div>反馈</div>
<div className="commentnum"><i className="iconfont icon-a-xiaoxi1 mr5 font-15"></i>10</div>
</div>
</div>
</div>
)

View File

@ -1,5 +1,5 @@
import React from 'react';
import { Dropdown , Menu , Icon , Input , Checkbox } from 'antd';
import { Dropdown , Menu , Icon , Input , Checkbox , Pagination } from 'antd';
import bj from '../Img/biaoji.png';
import create from '../Img/create.png';
import { Link } from 'react-router-dom';
@ -51,6 +51,9 @@ function List(props){
<Menus />
</div>
<Datas />
<div className="pt25 pb30" style={{textAlign:"right"}}>
<Pagination total={50} current={1} showSizeChanger showQuickJumper />
</div>
</div>
</div>
)

View File

@ -140,6 +140,15 @@
&.normal{
background-color:#28be6c;
}
&.hight{
background-color: #db7c1d;
}
&.urgent{
background-color: #db3d1d;
}
&.low{
background-color: #1abcb1;
}
}
.number{
background-color:rgba(213, 220, 246, 0.36);
@ -174,4 +183,38 @@
border-radius: 50%;
}
}
.issuecondition{
display: flex;
align-items: center;
color: #40424a;
.principal{
position: relative;
height: 30px;
img,span{
width: 20px;
height: 20px;
border-radius: 50%;
position: absolute;
right: 0px;
bottom: 4px;
}
span{
background-color:#ced5ef;
text-align: center;
line-height: 12px;
color:#000000;
z-index: 6;
}
}
&>div{
width: 106px;
text-align: right;
}
.commentnum{
padding-right: 5px;
display: flex;
align-items: center;
justify-content: flex-end;
}
}
}