forked from Gitlink/forgeplus-react
65 lines
2.0 KiB
JavaScript
65 lines
2.0 KiB
JavaScript
import React , { useEffect , useState } from 'react';
|
|
import { Modal , Input , Select } from 'antd';
|
|
const { Option }= Select;
|
|
|
|
const EVENT = ["push","pull_request","tag","cron","custom","promote","rollback"]
|
|
function PipelineName({visible,onCancel,onOk,value ,branchList}){
|
|
const [ name , setName ] = useState(undefined);
|
|
const [ branchValue , setBranchValue ] = useState(undefined);
|
|
const [ eventValue , setEventValue ] = useState(EVENT[0]);
|
|
|
|
useEffect(()=>{
|
|
if(branchList && branchList.length>0){
|
|
setBranchValue(branchList[0].name);
|
|
}
|
|
},[branchList])
|
|
|
|
useEffect(()=>{
|
|
if(value){
|
|
setName(value.pipeline_name);
|
|
setBranchValue(value.branch);
|
|
setEventValue(value.event);
|
|
}
|
|
},[value])
|
|
|
|
function onSure(){
|
|
onOk(name,value && value.id,branchValue,eventValue);
|
|
}
|
|
return(
|
|
<Modal
|
|
visible={visible}
|
|
title="流水线名称"
|
|
width={"500px"}
|
|
onCancel={onCancel}
|
|
onOk={onSure}
|
|
centered={true}
|
|
>
|
|
<div className="choosenList">
|
|
<span>流水线名称:</span>
|
|
<Input value={name} onChange={(e)=>setName(e.target.value)} placeholder="请输入名称" style={{width:"340px",margin:"6px 0px"}}/>
|
|
</div>
|
|
<div className="choosenList mt20">
|
|
<span>触发条件:</span>
|
|
<Select value={branchValue} style={{width:"150px"}} onChange={(e)=>setBranchValue(e)}>
|
|
{
|
|
branchList && branchList.length>0 && branchList.map((item,key)=>{
|
|
return(
|
|
<Option value={item.name} key={key}>{item.name}</Option>
|
|
)
|
|
})
|
|
}
|
|
</Select>
|
|
<Select mode="multiple" allowClear value={eventValue} style={{width:"180px",marginLeft:"10px"}} onChange={(e)=>{console.log(e);setEventValue(e)}}>
|
|
{
|
|
EVENT.map((item,key)=>{
|
|
return(
|
|
<Option value={item} key={key}>{item}</Option>
|
|
)
|
|
})
|
|
}
|
|
</Select>
|
|
</div>
|
|
</Modal>
|
|
)
|
|
}
|
|
export default PipelineName; |