diff --git a/src/forge/Component/NoticeModal/Index.scss b/src/forge/Component/NoticeModal/Index.scss
new file mode 100644
index 000000000..18e4dcda0
--- /dev/null
+++ b/src/forge/Component/NoticeModal/Index.scss
@@ -0,0 +1,90 @@
+.systemBox{
+ .ant-modal-body{
+ padding:1px 0px 0px 0px;
+ .sysBox{
+ background-image: url('./bg.png');
+ background-repeat: no-repeat;
+ background-size: 100% 334px;
+ margin-top: -55px;
+ }
+ .sysnoticeBox{
+ width: 100%;
+ padding:80px 0px 34px;
+ display: flex;
+ flex-direction: column;
+ width: 780px;
+ margin: 0px auto;
+ p.ntitle{
+ height: 33px;
+ font-size: 24px;
+ font-weight: 500;
+ color: #31FFF7;
+ line-height: 33px;
+ text-align: center;
+ }
+ p.nSubtitle{
+ height: 25px;
+ line-height: 25px;
+ font-size: 18px;
+ font-weight: 500;
+ color: #FFFFFF;
+ margin-top: 60px;
+ padding-left: 20px;
+ }
+ .markdown-body{
+ box-shadow: 0px 0px 17px rgba(0,0,0,0.2);
+ border-radius: 4px;
+ margin-top: 17px!important;
+ }
+ .nContent{
+ padding:20px 34px;
+ background-color: #fff;
+ line-height: 30px;
+ font-size: 15px;
+ font-weight: 400;
+ color: #333;
+ .realmName{
+ margin-top: 20px;
+ display: flex;
+ ul{
+ width: 50%;
+ padding-left: 0px!important;
+ li{
+ font-size: 15px;
+ font-weight: 500;
+ line-height: 32px;
+ text-align: left;
+ color: #000;
+ list-style-type: none!important;
+ &:first-child{
+ color: #E65714;
+ }
+ }
+ }
+ }
+ .nSubdesc{
+ font-size: 15px;
+ font-weight: 400;
+ color: #000000;
+ line-height: 31px;
+ margin-top: 20px;
+ }
+ .nInfo{
+ font-size: 14px;
+ font-weight: 400;
+ color: #333333;
+ text-align: right;
+ margin-top: 25px;
+ p{
+ height: 20px;
+ line-height: 20px;
+ }
+ }
+ }
+ .nBtn{
+ text-align: center;
+ margin-top: 33px;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/forge/Component/NoticeModal/SystemNotice.jsx b/src/forge/Component/NoticeModal/SystemNotice.jsx
new file mode 100644
index 000000000..917b87c85
--- /dev/null
+++ b/src/forge/Component/NoticeModal/SystemNotice.jsx
@@ -0,0 +1,87 @@
+import React , { useEffect , useState } from 'react';
+import { Modal , Button } from 'antd';
+import './Index.scss';
+import '../../css/index.scss';
+import RenderHtml from '../../../components/render-html';
+import cookie from 'react-cookies';
+
+function SystemNotice({system_notification,history}){
+ const [ visible , setVisible ] = useState(false);
+
+ useEffect(()=>{
+ if(system_notification && !cookie.load('notice_stage')){
+ setVisible(true);
+ }
+ },[system_notification])
+
+ function sureContinue() {
+ // if(login && ( system_notification && system_notification.id )){
+ // const url = `/users/${login}/system_notification_histories.json`;
+ // axios.post(url,{
+ // system_notification_id:system_notification.id
+ // }).then(result=>{
+ // if(result && result.status === 0){
+ // setVisible(false);
+ // hideSystemNotice();
+ // }
+ // }).catch(error=>{})
+ // }
+ console.log("cookies before:",cookie.load('notice_stage')) ;
+ cookie.remove('notice_stage');
+ let inFifteenMinutes = new Date(new Date().getTime() + 24 * 3600 * 1000);//一天
+ // let inFifteenMinutes = new Date(new Date().getTime() + 60 * 1000);//一分钟
+ cookie.save('notice_stage', true,{ expires: inFifteenMinutes });
+ console.log("cookies after:",cookie.load('notice_stage')) ;
+ setVisible(false);
+ }
+
+ return (
+ {system_notification && system_notification.subject} {system_notification && system_notification.sub_subject} Gitlink运营团队 2021年10月xx日
+
+
+
+