forked from Gitlink/forgeplus-react
94 lines
3.4 KiB
JavaScript
94 lines
3.4 KiB
JavaScript
import React,{ forwardRef , useCallback } from 'react';
|
||
import './Index.scss';
|
||
import { Form , Input , Cascader , Radio , Checkbox , Upload , Button } from "antd";
|
||
import { locData } from "../Utils/locData";
|
||
|
||
export default Form.create()(
|
||
forwardRef(({form})=>{
|
||
const { getFieldDecorator, validateFields, setFieldsValue } = form;
|
||
const radioStyle = {
|
||
display: 'block',
|
||
height: '30px',
|
||
lineHeight: '30px',
|
||
}
|
||
const helper = useCallback(
|
||
(label, name, rules, widget, isRequired = true) => (
|
||
<React.Fragment>
|
||
<span className={isRequired?"lables must":"lables"}>{label}</span>
|
||
<Form.Item>
|
||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||
</Form.Item>
|
||
</React.Fragment>
|
||
),
|
||
[]
|
||
);
|
||
return(
|
||
<div className="newMain">
|
||
<div className="main">
|
||
<div className="teamBox">
|
||
<p className="teamBox-title">新建组织</p>
|
||
<Form className="teamBox-form">
|
||
{helper(
|
||
<span>组织名称：<span className="color-grey-8">(组织名称应该简单明了)</span></span>,
|
||
"name",
|
||
[{ required: true, message: "请输入组织名称" }],
|
||
<Input
|
||
placeholder="请输入组织名称"
|
||
/>
|
||
)}
|
||
{helper(
|
||
'组织描述',
|
||
"description",
|
||
[{ required: true, message: "请输入组织描述" }],
|
||
<Input.TextArea
|
||
autoSize={{ minRows: 3, maxRows: 5 }}
|
||
placeholder="请输入组织描述"
|
||
/>
|
||
)}
|
||
{helper(
|
||
'所在地区',
|
||
"location",
|
||
[],
|
||
<Cascader placeholder="请选择城市" options={locData}/>,false
|
||
)}
|
||
{helper(
|
||
'可见性',
|
||
"visibility",
|
||
[{ required: true, message: "请选择可见性" }],
|
||
<Radio.Group name="exposure">
|
||
<Radio style={radioStyle} value="1" key={1}>公开</Radio>
|
||
<Radio style={radioStyle} value="2" key={2}>受限<span className="color-grey-8">（仅对登录用户可见）</span></Radio>
|
||
<Radio style={radioStyle} value="3" key={3}>公开<span className="color-grey-8">（仅对组织成员可见）</span></Radio>
|
||
</Radio.Group>
|
||
)}
|
||
{helper(
|
||
'选择头像',
|
||
"image",
|
||
[],
|
||
<Upload></Upload>,false
|
||
)}
|
||
{helper(
|
||
'权限',
|
||
"repo_admin_change_team_access",
|
||
[],
|
||
<Checkbox value="1" key={1}>项目管理员可以添加或移除团队的访问权限</Checkbox>,false
|
||
)}
|
||
{helper(
|
||
<span>最大仓库数：<span className="color-grey-8">（设置为-1表示使用全局默认值）</span></span>,
|
||
"max_repo_creation",
|
||
[],
|
||
<Input
|
||
placeholder="最大仓库数" style={{width:"100px"}}
|
||
/>,false
|
||
)}
|
||
</Form>
|
||
</div>
|
||
<p className="mt20">
|
||
<Button type="primary" className="mr30">创建组织</Button>
|
||
<Button className="grey">取消</Button>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
)
|
||
})
|
||
) |