下拉主分支代码

This commit is contained in:
何童崇 2021-09-07 10:33:01 +08:00
commit a667f41ec1
5 changed files with 103 additions and 27 deletions

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 2340181 */
src: url('iconfont.woff2?t=1630632852475') format('woff2'),
url('iconfont.woff?t=1630632852475') format('woff'),
url('iconfont.ttf?t=1630632852475') format('truetype');
src: url('iconfont.woff2?t=1630894072659') format('woff2'),
url('iconfont.woff?t=1630894072659') format('woff'),
url('iconfont.ttf?t=1630894072659') format('truetype');
}
.iconfont {

View File

@ -2,7 +2,7 @@ import React, { Component } from 'react';
import AccountProfile from "../../modules/user/AccountProfile";
import { getImageUrl } from 'educoder'
import axios from 'axios';
import { Input , notification , Dropdown , Menu } from 'antd';
import { Input , notification , Dropdown , Menu,Badge, Button } from 'antd';
import { Link } from 'react-router-dom';
import LoginDialog from '../../modules/login/LoginDialog';
@ -255,6 +255,26 @@ class NewHeader extends Component {
</div>
)
}
messageList=()=>{
return(
<div className="messageHoverDiv">
<Menu mode="horizontal">
<Menu.Item key="0"><Badge count={5}>系统通知</Badge></Menu.Item>
<Menu.Item key="1"><Badge count={10}>私信</Badge></Menu.Item>
<Menu.Item key="2"><Badge count={99}>@</Badge></Menu.Item>
</Menu>
<div className="content">
aaa
</div>
<div className = "buttom">
<a>全部消息</a>
<a>标记为已读</a>
</div>
</div>
)
}
renderMenu=(personal)=>{
const { current_user } = this.props;
return(
@ -435,14 +455,17 @@ class NewHeader extends Component {
</Dropdown>:""
}
{this.props.user && this.props.user.login && notice_url ?
{/* {this.props.user && this.props.user.login && notice_url ? */}
{this.props.user && this.props.user.login ?
<div className="ml30 edu-menu-panel">
{user && user.login &&
<a href={`${notice_url}`} style={{ position: 'relative' }}>
<i className="iconfont icon-xiaoxilingdang color-grey-6"></i>
<span className="newslight" style={{ display: this.props.Headertop === undefined ? "none" : this.props.Headertop.new_message === true ? "block" : "none" }}>
</span>
</a>
<Dropdown placement={`bottomRight`} overlay={this.messageList(settings && settings.personal)}>
<a href={`/settings/notice/myNotice`} style={{ position: 'relative' }}>
<i className="iconfont icon-xiaoxilingdang color-grey-6"></i>
<span className="newslight" style={{ display: this.props.Headertop === undefined ? "none" : this.props.Headertop.new_message === true ? "block" : "none" }}>
</span>
</a>
</Dropdown>
}
</div>:""
}

View File

@ -26,6 +26,22 @@
border-radius: 50%;
margin-left: 30px;
}
.messageHoverDiv{
padding: 20px 17px 13px;
width: 386px;
min-height: 294px;
background: #FFFFFF;
box-shadow: 0px 4px 8px 2px rgba(212,212,212,0.5);
border-radius: 4px;
border: 1px solid red;
.buttom{
display: flex;
justify-content: space-between;
}
}
.currentMenu{
width: 120px;
text-align: center;

View File

@ -14,6 +14,16 @@ import { Link } from 'react-router-dom';
import './Index.scss';
const MyNoticeIndex = Loadable({
loader: () => import("./notice/myNotice/Index"),
loading: Loading,
});
const NoticeManager = Loadable({
loader: () => import("./notice/manager/Index"),
loading: Loading,
});
const SSHNew = Loadable({
loader: () => import("./sub/New"),
loading: Loading,
@ -39,18 +49,35 @@ function Index(props){
<img src={getImageUrl(`/${current_user && current_user.image_url}`)} alt=""/>
<span>{current_user && current_user.username}</span>
</div>
<ul className="securityUl" style={{'border-bottom':'1px solid rgba(153, 153, 153, 0.22)','padding-bottom':'5px'}}>
<li>消息通知</li>
<li className={pathname.indexOf("/settings/notice/myNotice")>-1 ?"active":""}><Link to={`/settings/notice/myNotice`}><i className="iconfont icon-wodetongzhi"></i><span>我的通知</span></Link></li>
<li className={pathname.indexOf("/settings/notice/noticeManager")>-1 ?"active":""}><Link to={`/settings/notice/noticeManager`}><i className="iconfont icon-tongzhiguanli"></i><span>通知管理</span></Link></li>
</ul>
<ul className="securityUl">
<li>个人信息</li>
<li className={pathname.indexOf("/settings/profile")>-1 ?"active":""}><Link to={`/settings/profile`}><i className="iconfont icon-gerenziliao mr5 font-14"></i>基本资料</Link></li>
</ul>
<ul className="securityUl">
<li>安全设置</li>
<li className={pathname.indexOf("/settings/SSH")>-1 ?"active":""}><Link to={`/settings/SSH`}><i className="iconfont icon-xuanzhongssh_icon mr5 font-14"></i>SSH密钥</Link></li>
<li className={pathname.indexOf("/settings/SSH")>-1 ?"active":""}><Link to={`/settings/SSH`}><i className="iconfont icon-xuanzhongssh_icon mr5 font-14"></i><span>SSH密钥</span></Link></li>
</ul>
</div>
<LongWidth>
<Gap>
<Switch>
<Route
path="/settings/notice/myNotice"
render={(p) => (
<MyNoticeIndex {...props} {...p}/>
)}
></Route>
<Route
path="/settings/notice/noticeManager"
render={(p) => (
<NoticeManager {...props} {...p}/>
)}
></Route>
<Route
path="/settings/SSH/new"
render={(p) => (

View File

@ -8,42 +8,44 @@
width: 198px;
border: 1px solid rgba(153, 153, 153, 0.22);
border-radius: 4px;
min-height: 400px;
// min-height: 400px;
margin-bottom: 30px;
.userDetail{
background: rgba(153, 153, 153, 0.05);
border-radius: 4px 4px 0px 0px;
padding:20px 25px;
display: flex;
align-items: center;
justify-content: flex-start;
text-align: center;
height: 105px;
img{
height: 48px;
width: 48px;
border-radius: 50%;
margin-right: 12px;
}
span{
font-size: 16px;
color: #333;
max-width: 90px;
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: 500;
}
}
.securityUl{
padding:20px 16px;
padding-left: 17px;
color: #333;
margin-bottom: 0px;
padding-bottom: 0px;
li{
margin-bottom: 10px;
font-size: 14px;
margin-top: 8px;
margin-bottom: 8px;
height: 27px;
line-height: 27px;
position: relative;
cursor: pointer;
// border: 1px solid;
a{
color: #666;
&:hover{
@ -52,30 +54,38 @@
}
&.active a{
color: #333;
}
&:first-child{
font-size: 16px;
span{
font-weight: 600;
}
}
&.active::before{
position: absolute;
left: -16px;
top:0px;
height: 100%;
width: 2px;
left: -18px;
top:6px;
height: 15px;
width: 3px;
border-radius: 2px;
content: "";
background-color: #2A61FF;
}
i{
font-size: 14px !important;
margin-right: 8px;
}
}
}
}
.sshHead{
display: flex;
align-items: center;
padding:15px 20px;
padding:6px 0px;
margin-bottom: 15px;
justify-content: space-between;
border-bottom: 1px solid #EEEEEE;
&>span{
font-size: 18px;
font-weight: 600;
}
}
.ant-list-item{