forked from Gitlink/forgeplus-react
git地址提示
This commit is contained in:
parent
46b5123fab
commit
904da46b8c
|
|
@ -14,6 +14,7 @@ class CloneAddress extends Component {
|
|||
const { http_url, downloadUrl } = this.props;
|
||||
return (
|
||||
<div className="gitAddressClone">
|
||||
<p className="addressTips"><span>版本库地址已变更,请基于新地址提交代码</span></p>
|
||||
{
|
||||
http_url && <span>HTTP</span>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import { Blueback } from '../Component/layout';
|
|||
import styled from 'styled-components';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Form , Input } from 'antd';
|
||||
import axios from 'axios';
|
||||
|
||||
const P = styled.p`{
|
||||
width:200px;
|
||||
|
|
@ -14,56 +15,64 @@ const P = styled.p`{
|
|||
margin-top:30px;
|
||||
margin-bottom:30px!important;
|
||||
}`;
|
||||
export default Form.create()(
|
||||
forwardRef(({ form })=>{
|
||||
const { getFieldDecorator , validateFields } = form;
|
||||
function About( props , ref){
|
||||
const { form: { getFieldDecorator , validateFields } } = props;
|
||||
const helper = useCallback(
|
||||
(label, name, rules, widget, isRequired) => (
|
||||
<React.Fragment>
|
||||
<span className={isRequired?"required":""}>{label}</span>
|
||||
<Form.Item>
|
||||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||||
</Form.Item>
|
||||
</React.Fragment>
|
||||
),
|
||||
[]
|
||||
);
|
||||
|
||||
const helper = useCallback(
|
||||
(label, name, rules, widget, isRequired) => (
|
||||
<React.Fragment>
|
||||
<span className={isRequired?"required":""}>{label}</span>
|
||||
<Form.Item>
|
||||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||||
</Form.Item>
|
||||
</React.Fragment>
|
||||
),
|
||||
[]
|
||||
);
|
||||
|
||||
function startActive(){
|
||||
validateFields((error,value)=>{
|
||||
if(!error){
|
||||
console.log(value);
|
||||
}
|
||||
})
|
||||
}
|
||||
return(
|
||||
<div className="activatePanel">
|
||||
<img src={activate} alt="" width="250px"/>
|
||||
<P>定义DevOps工作流,帮助您检测bug、发布代码…</P>
|
||||
<Link to={""} style={{color:"#5091FF",marginTop:"20px"}}>了解什么是DevOps?</Link>
|
||||
<Form>
|
||||
{helper(
|
||||
"服务器IP地址:",
|
||||
"IP",
|
||||
[{ required: true, message: "请输入服务器IP地址" }],
|
||||
<Input placeholder="请输入服务器IP地址" style={{width:"368px"}} size="large" />,true
|
||||
)}
|
||||
{helper(
|
||||
"服务器用户名:",
|
||||
"username",
|
||||
[{ required: true, message: "请输入服务器用户名" }],
|
||||
<Input placeholder="请输入服务器用户名" size="large" />,true
|
||||
)}
|
||||
{helper(
|
||||
"服务器密码:",
|
||||
"password",
|
||||
[{ required: true, message: "请输入服务器密码" }],
|
||||
<Input.Password placeholder="请输入服务器密码" size="large" />,true
|
||||
)}
|
||||
</Form>
|
||||
<Blueback onClick={startActive}>开始激活</Blueback>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
)
|
||||
function startActive(){
|
||||
console.log(props);
|
||||
validateFields((error,values)=>{
|
||||
if(!error){
|
||||
const url = `/dev_ops/cloud_accounts.json`;
|
||||
axios.post(url,{
|
||||
...values,
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
|
||||
}
|
||||
}).catch(error=>{
|
||||
console.log(error);
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
return(
|
||||
<div className="activatePanel">
|
||||
<img src={activate} alt="" width="250px"/>
|
||||
<P>定义DevOps工作流,帮助您检测bug、发布代码…</P>
|
||||
<Link to={""} style={{color:"#5091FF",marginBottom:"20px"}}>了解什么是DevOps?</Link>
|
||||
<Form>
|
||||
{helper(
|
||||
"服务器IP地址:",
|
||||
"ip_num",
|
||||
[{ required: true, message: "请输入服务器IP地址" }],
|
||||
<Input placeholder="请输入服务器IP地址" style={{width:"368px"}} size="large" />,true
|
||||
)}
|
||||
{helper(
|
||||
"服务器用户名:",
|
||||
"account",
|
||||
[{ required: true, message: "请输入服务器用户名" }],
|
||||
<Input placeholder="请输入服务器用户名" size="large" />,true
|
||||
)}
|
||||
{helper(
|
||||
"服务器密码:",
|
||||
"secret",
|
||||
[{ required: true, message: "请输入服务器密码" }],
|
||||
<Input.Password placeholder="请输入服务器密码" size="large" />,true
|
||||
)}
|
||||
</Form>
|
||||
<Blueback onClick={startActive}>开始激活</Blueback>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Form.create()(forwardRef(About));
|
||||
|
|
@ -332,6 +332,7 @@
|
|||
border:1px solid #eee;
|
||||
background: #fff;
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.gitAddressClone > span{
|
||||
display: flex;
|
||||
|
|
@ -341,6 +342,53 @@
|
|||
cursor: pointer;
|
||||
align-items: center;
|
||||
}
|
||||
.addressTips{
|
||||
position: absolute;
|
||||
font-size: 12px;
|
||||
color: #FF6E21;
|
||||
top:-34px;
|
||||
left: 30px;
|
||||
background-color: #fff;
|
||||
border:1px solid #FE881D;
|
||||
padding:0px 5px;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.addressTips>span{position: relative;display: block;}
|
||||
.addressTips>span::before{
|
||||
box-sizing: content-box;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left:50%;
|
||||
margin-left: -4px;
|
||||
padding:0;
|
||||
border-top:8px solid #FFFFFF;
|
||||
border-bottom:8px solid transparent;
|
||||
border-left:8px solid transparent;
|
||||
border-right:8px solid transparent;
|
||||
display: block;
|
||||
content:'';
|
||||
z-index: 12;
|
||||
}
|
||||
.addressTips>span::after{
|
||||
box-sizing: content-box;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
position: absolute;
|
||||
top: 26px;
|
||||
left:50%;
|
||||
margin-left: -4px;
|
||||
padding:0;
|
||||
border-top:8px solid #FE881D;
|
||||
border-bottom:8px solid transparent;
|
||||
border-left:8px solid transparent;
|
||||
border-right:8px solid transparent;
|
||||
display: block;
|
||||
content:'';
|
||||
z-index: 11;
|
||||
}
|
||||
.gitAddressClone > span.addressType{
|
||||
color: #4CACFF;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue