forked from Gitlink/forgeplus-react
330 lines
10 KiB
JavaScript
330 lines
10 KiB
JavaScript
import React , { Component } from 'react';
|
||
import { Link } from 'react-router-dom';
|
||
import { Input , Form , Select , Checkbox , Button , Divider ,Spin } from 'antd';
|
||
|
||
import '../css/index.css';
|
||
import './new.css'
|
||
|
||
import axios from 'axios' ;
|
||
const Option = Select.Option
|
||
class Index extends Component{
|
||
constructor(props){
|
||
super(props);
|
||
this.state={
|
||
// authorValue:"0",
|
||
preType:"0",
|
||
// subType:"0",
|
||
languageValue:"0",
|
||
gitignoreType:"0",
|
||
LicensesType:"0",
|
||
|
||
CategoryList:undefined,
|
||
LanguageList:undefined,
|
||
GitignoreList:undefined,
|
||
LicensesList:undefined,
|
||
isSpin:false,
|
||
}
|
||
}
|
||
getUserInfo=()=>{
|
||
const url = `/users/me.json`;
|
||
axios.get(url).then(result=>{
|
||
if(result && result.data.login){
|
||
this.setState({
|
||
current_user:result.data
|
||
})
|
||
this.getDetail();
|
||
}
|
||
}).catch(error=>{
|
||
console.log(error)
|
||
})
|
||
}
|
||
componentDidMount=()=>{
|
||
// this.getUserInfo();
|
||
// 获取项目类别
|
||
this.getCategory();
|
||
// 获取项目语言
|
||
this.getLanguage();
|
||
// 获取Gitignore
|
||
this.getGitignore();
|
||
// 获取开源许可证
|
||
this.getLicenses();
|
||
}
|
||
getCategory=()=>{
|
||
const url = `/project_categories.json`
|
||
axios.get(url).then((result)=>{
|
||
if(result){
|
||
let CategoryList = this.setOptionsList(result.data.project_categories)
|
||
this.setState({
|
||
CategoryList
|
||
})
|
||
}
|
||
}).catch((error)=>{})
|
||
}
|
||
|
||
getLanguage=()=>{
|
||
const url = `/project_languages.json`
|
||
axios.get(url).then((result)=>{
|
||
if(result){
|
||
let LanguageList = this.setOptionsList(result.data.project_languages)
|
||
this.setState({
|
||
LanguageList
|
||
})
|
||
}
|
||
}).catch((error)=>{})
|
||
}
|
||
|
||
getGitignore=()=>{
|
||
const url = `/ignores.json`
|
||
axios.get(url).then((result)=>{
|
||
if(result){
|
||
let GitignoreList = this.setOptionsList(result.data.ignores)
|
||
this.setState({
|
||
GitignoreList
|
||
})
|
||
}
|
||
}).catch((error)=>{})
|
||
}
|
||
|
||
getLicenses=()=>{
|
||
const url = `/licenses.json`
|
||
axios.get(url).then((result)=>{
|
||
if(result){
|
||
let LicensesList = this.setOptionsList(result.data.licenses)
|
||
this.setState({
|
||
LicensesList
|
||
})
|
||
}
|
||
}).catch((error)=>{})
|
||
}
|
||
|
||
setOptionsList = (data) =>{
|
||
let list = undefined;
|
||
if(data && data.length > 0){
|
||
list = data.map((item,key)=>{
|
||
return(
|
||
<Option key={item.id}>{item.name}</Option>
|
||
)
|
||
})
|
||
}
|
||
return list;
|
||
}
|
||
|
||
subMitFrom = () =>{
|
||
this.setState({
|
||
isSpin:true
|
||
})
|
||
this.props.form.validateFieldsAndScroll((err, values) => {
|
||
if(!err){
|
||
const { current_user } = this.props;
|
||
const { projectsType } =this.props.match.params;
|
||
const url = projectsType === "deposit" ? "/projects.json" :"/projects/migrate.json";
|
||
axios.post(url,{
|
||
...values,
|
||
user_id:current_user.user_id
|
||
}).then((result)=>{
|
||
if(result){
|
||
if(result.data.id){
|
||
this.setState({
|
||
isSpin:false
|
||
})
|
||
this.props.showNotification(`${projectsType === "deposit" ? "托管" :"镜像"}项目创建成功!`);
|
||
this.props.history.push(`/projects/${result.data.id}/coders`);
|
||
}
|
||
}
|
||
}).catch((error)=>{
|
||
this.setState({
|
||
isSpin:false
|
||
})
|
||
console.log(error);
|
||
})
|
||
}else{
|
||
this.setState({
|
||
isSpin:false
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
render(){
|
||
const { getFieldDecorator } = this.props.form;
|
||
// 项目类型：deposit-托管项目，mirror-镜像项目
|
||
const { projectsType } =this.props.match.params;
|
||
const {
|
||
// authorValue,
|
||
preType,
|
||
// subType,
|
||
languageValue,
|
||
gitignoreType,
|
||
LicensesType,
|
||
|
||
CategoryList,
|
||
LanguageList,
|
||
GitignoreList,
|
||
LicensesList,
|
||
isSpin
|
||
}=this.state;
|
||
|
||
console.log("current_user",this.props);
|
||
return(
|
||
<div className="main back-white">
|
||
<div className="newPanel">
|
||
<div className="newPanel_title">创建{projectsType === "deposit" ? "托管":"镜像"}项目</div>
|
||
<Spin spinning={isSpin}>
|
||
<Form>
|
||
<div className="newPanel_content">
|
||
{/* <Form.Item
|
||
label="拥有者"
|
||
>
|
||
{getFieldDecorator('user_id', {
|
||
rules: [{
|
||
required: true, message: '请选择拥有者'
|
||
}],
|
||
})(
|
||
<Select value={authorValue}>
|
||
<Option key="0">kosasa</Option>
|
||
</Select>
|
||
)}
|
||
</Form.Item> */}
|
||
{
|
||
projectsType != "deposit" &&
|
||
<React.Fragment>
|
||
<Form.Item
|
||
label="镜像版本库地址"
|
||
style={{marginBottom:"0px"}}
|
||
>
|
||
{getFieldDecorator('clone_addr', {
|
||
rules: [{
|
||
required: true, message: '请填写镜像版本库地址'
|
||
}],
|
||
})(
|
||
<Input placeholder="输入需要同步到本项目的镜像版本库地址"/>
|
||
)}
|
||
</Form.Item>
|
||
<p className="formTip">示例：https://github.com/facebook/reack.git</p>
|
||
</React.Fragment>
|
||
}
|
||
<Form.Item
|
||
label="项目名称"
|
||
>
|
||
{getFieldDecorator('name', {
|
||
rules: [{
|
||
required: true, message: '请填写项目名称'
|
||
}],
|
||
})(
|
||
<Input placeholder="例如：团队协作方法与研究"/>
|
||
)}
|
||
</Form.Item>
|
||
|
||
<Form.Item
|
||
label="项目简介"
|
||
>
|
||
{getFieldDecorator('description', {
|
||
rules: [{
|
||
required: true, message: '请填写项目简介'
|
||
}],
|
||
})(
|
||
<Input.TextArea autoSize={{ minRows: 2, maxRows: 6 }}/>
|
||
)}
|
||
</Form.Item>
|
||
<Form.Item
|
||
label="仓库名称"
|
||
style={{marginBottom:"20px"}}
|
||
>
|
||
{getFieldDecorator('repository_name', {
|
||
rules: [{
|
||
required: true, message: '请填写仓库名称'
|
||
}],
|
||
})(
|
||
<Input placeholder="仓库名称请使用简单、深刻和独特的关键字"/>
|
||
)}
|
||
</Form.Item>
|
||
{/*<p className="formTip">好的存储库名称使用简单、深刻和独特的关键字</p>*/}
|
||
{/* <div className="newContent_inline"> */}
|
||
<Form.Item
|
||
label="项目类别"
|
||
>
|
||
{getFieldDecorator('project_category_id', {
|
||
rules: [{
|
||
required: true, message: '请选择大类别'
|
||
}],
|
||
})(
|
||
<Select value={preType}>
|
||
{CategoryList}
|
||
</Select>
|
||
)}
|
||
</Form.Item>
|
||
{/* <Form.Item>
|
||
{getFieldDecorator('project_language_id', {
|
||
rules: [{
|
||
required: true, message: '请选择子类别'
|
||
}],
|
||
})(
|
||
<Select value={subType} className="inline_Tag">
|
||
<Option key="0">HTMl</Option>
|
||
<Option key="1">HTMl111</Option>
|
||
</Select>
|
||
)}
|
||
</Form.Item> */}
|
||
{/* </div> */}
|
||
<Form.Item
|
||
label="项目语言"
|
||
>
|
||
{getFieldDecorator('project_language_id', {
|
||
rules: [{
|
||
required: true, message: '请选择项目语言'
|
||
}],
|
||
})(
|
||
<Select value={languageValue}>
|
||
{LanguageList}
|
||
</Select>
|
||
)}
|
||
</Form.Item>
|
||
</div>
|
||
<Divider />
|
||
<div className="newPanel_content">
|
||
{
|
||
projectsType === "deposit" &&
|
||
<React.Fragment>
|
||
<Form.Item
|
||
label=".gitignore"
|
||
>
|
||
{getFieldDecorator('ignore_id')(
|
||
<Select value={gitignoreType} className="inline_Tag">
|
||
{GitignoreList}
|
||
</Select>
|
||
)}
|
||
</Form.Item>
|
||
<Form.Item
|
||
label="开源许可证"
|
||
>
|
||
{getFieldDecorator('license_id')(
|
||
<Select value={LicensesType} className="inline_Tag">
|
||
{LicensesList}
|
||
</Select>
|
||
)}
|
||
</Form.Item>
|
||
</React.Fragment>
|
||
}
|
||
<Form.Item
|
||
label="可见性"
|
||
style={{marginBottom:"0px"}}
|
||
>
|
||
{getFieldDecorator('private')(
|
||
<Checkbox value="limit">将项目设为私有</Checkbox>
|
||
)}
|
||
</Form.Item >
|
||
<p className="formTip">只有企业所有人或拥有权限的企业成员才能看到</p>
|
||
<Form.Item className="formTip">
|
||
<Button type="primary" onClick={this.subMitFrom} className="mr20">创建项目</Button>
|
||
<Link to={'/projects'} className="btn_32">取消</Link>
|
||
</Form.Item>
|
||
</div>
|
||
</Form>
|
||
</Spin>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
}
|
||
const WrappedIndexForm = Form.create({ name: 'NewWorkForm' })(Index);
|
||
export default WrappedIndexForm; |