forgeplus-react/src/forge/Issues/Pages/new.jsx

269 lines
8.6 KiB
JavaScript

import React , { useEffect , useState , forwardRef } from 'react';
import { Form } from 'antd';
import { Box , LongWidth } from '../../Component/layout';
import DropMenu from '../Component/dropMenu';
import AddTagsBox from '../Component/addTagsBox';
import Date from '../Component/date';
import NewPanel from '../Component/newPanel';
import axios from 'axios';
function New(props){
// 里程碑id
const milepostId = props.match.params.milepostId;
const [ visible , setVisible ] = useState(false);
const [ statusList , setStatusList ] = useState([]);
const [ prioritiesList , setPrioritiesList ] = useState([]);
const [ chargeList , setChargeList ] = useState([]);
const [ charge , setCharge ] = useState(undefined);
const [ millstoneList , setMillstoneList ] = useState([]);
const [ millstone , setMillstone ] = useState(undefined);
const [ tagList , setTagList ] = useState(undefined);
const [ tag , setTag ] = useState(undefined);
const [ branchList , setBranchList ] = useState(undefined);
const [ branch , setBranch ] = useState(undefined);
const [ assigner_choose , setAssigner_choose ] = useState([]);
const [ prioritie_choose , setPrioritie_choose ] = useState([]);
const [ status_choose , setStatus_choose ] = useState([]);
const [ tag_choose , setTag_choose ] = useState([]);
const [ millstone_choose , setMillstone_choose ] = useState([]);
const [ branch_choose , setBranch_choose ] = useState([]);
const [ start_date, setStartDate ] = useState("");//moment().format('YYYY-MM-DD')
const [ due_date, setDueDate ] = useState("");
const owner = props.match.params.owner;
const projectsId = props.match.params.projectsId;
const permission = props && props.projectDetail && props.projectDetail.permission;
useEffect(()=>{
const {projectDetail} = props;
if(projectDetail){
const { author, name} = projectDetail;
document.title = `新建疑修-${author.name}/${name}`
}
},[])
useEffect(()=>{
if(milepostId){
getMillstone(milepostId);
}
},[milepostId])
// 获取状态列表
useEffect(()=>{
getStatus();
},[])
function getStatus(){
const url = `/v1/${owner}/${projectsId}/issue_statues`;
axios.get(url).then(result=>{
if(result && result.data){
let status = result.data.statues;
setStatusList(status);
if(status && status.length>0){
setStatus_choose(status.filter(i=>i.id === 1));
}
}
})
}
// 获取优先级列表
useEffect(()=>{
getPriorities();
},[])
function getPriorities(){
const url = `/v1/${owner}/${projectsId}/issue_priorities`;
axios.get(url).then(result=>{
if(result && result.data){
let priorities = result.data.priorities;
let array =[];
let colors = ["#1abcb1","#28be6c","#db3d1d","#db3d1d"];
if(priorities && priorities.length>0){
array = priorities.map((i,k)=>{
let arr = {...i,color:colors[k]}
return arr;
})
}
setPrioritiesList(array);
setPrioritie_choose(array.filter(i=>i.id === 2));
}
})
}
// 获取负责人列表
useEffect(()=>{
getCharge();
},[charge])
function getCharge(){
const url = `/v1/${owner}/${projectsId}/collaborators`;
axios.get(url,{params:{keyword:charge,only_name:true}}).then(result=>{
if(result && result.data){
setChargeList(result.data.collaborators);
}
})
}
// 获取里程碑列表
useEffect(()=>{
getMillstone(millstone);
},[millstone])
function getMillstone(keyword){
const url = `/v1/${owner}/${projectsId}/milestones`;
axios.get(url,{params:{keyword,only_name:true}}).then(result=>{
if(result && result.data){
let milestones = result.data.milestones;
if(milepostId === keyword){
setMillstone_choose(milestones);
}else{
setMillstoneList(milestones);
}
}
})
}
// 获取标记列表
useEffect(()=>{
getSign();
},[tag])
function getSign(){
const url = `/v1/${owner}/${projectsId}/issue_tags`;
axios.get(url,{params:{keyword:tag,only_name:true}}).then(result=>{
if(result && result.data){
setTagList(result.data.issue_tags);
}
})
}
// 获取标记列表
useEffect(()=>{
getBranch(branch);
},[branch])
function getBranch(branch){
if(branch){
let b = [...branchList];
let l = b.filter(i=>i.name.indexOf(branch)>-1);
setBranchList(l);
return ;
}
const url = `/${owner}/${projectsId}/branches.json`;
axios.get(url,{params:{keyword:tag}}).then(result=>{
if(result && result.data){
setBranchList(result.data);
}
})
}
// 标记管理弹框
function onSuccess(){
// 添加标记成功后需更新标记的数据数组
getSign();
setVisible(false);
}
// 创建
function createFunc(values,fileList,receivers_login,description){
const { subject } = values;
const url = `/v1/${owner}/${projectsId}/issues`;
let b = branch_choose && branch_choose.length>0 ? branch_choose.map(i=>{return i.name}) :undefined;
let t = tag_choose && tag_choose.length>0 ? tag_choose.map(i=>{return i.id}) :undefined;
let a = assigner_choose && assigner_choose.length>0 ? assigner_choose.map(i=>{return i.id}) :undefined;
let m = millstone_choose && millstone_choose.length>0 ? millstone_choose.map(i=>{return i.id}) :undefined;
let p = prioritie_choose && prioritie_choose.length>0 ? prioritie_choose.map(i=>{return i.id}) :undefined;
let s = status_choose && status_choose.length>0 ? status_choose.map(i=>{return i.id}) :undefined;
axios.post(url,{
description,subject,
branch_name:b.join(","),
status_id:s.join(","),
priority_id:p.join(","),
milestone_id:m.join(","),
issue_tag_ids:t,
assigner_ids:a,
attachment_ids:fileList,
start_date,due_date,receivers_login
}).then(result=>{
if(result && result.data && result.data.project_issues_index){
props.showNotification("任务创建成功!");
props.history.push(`/${owner}/${projectsId}/issues/${result.data.project_issues_index}`);
}
}).catch(error=>{})
}
return(
<div>
<AddTagsBox
owner={owner}
projectsId={projectsId}
visible={visible}
onCancel={()=>setVisible(false)} onSuccess={onSuccess}
/>
<p className="font-17 color-grey-3 mt20 mb15">新建疑修</p>
<Box>
<LongWidth>
<NewPanel {...props} createFunc={createFunc}
owner = {owner} projectsId = {projectsId}/>
</LongWidth>
<div className="shortwidth">
<DropMenu
placeholder="负责人"
menus={chargeList}
searchFunc={(value)=>{setCharge(value)}}
headImg
selectValueList={assigner_choose}
chooseFunc={(list)=>{setAssigner_choose(list);}}
double={5}
/>
<DropMenu
placeholder="状态"
menus={statusList}
selectValueList={status_choose}
mustFlag
editFlag={false}
chooseFunc={(list)=>{setStatus_choose(list);}}
/>
<DropMenu
placeholder="优先级"
menus={prioritiesList}
selectValueList={prioritie_choose}
colorFlag
mustFlag
chooseFunc={(list)=>{setPrioritie_choose(list);}}
/>
<DropMenu
placeholder="标记"
menus={tagList}
searchFunc={(value)=>{setCharge(value)}}
selectValueList={tag_choose}
chooseFunc={(list)=>{setTag_choose(list);}}
double={3}
colorFlag
onAdd={permission && permission !== "Reporter" ? ()=>setVisible(true) :false}
/>
<DropMenu
placeholder="里程碑"
menus={millstoneList}
searchFunc={(value)=>{setCharge(value)}}
selectValueList={millstone_choose}
editFlag={milepostId ? true : false}
chooseFunc={(list)=>{setMillstone_choose(list);}}
/>
<DropMenu
placeholder="关联分支"
menus={branchList}
searchFunc={(value)=>{setCharge(value)}}
selectValueList={branch_choose}
chooseFunc={(list)=>{setBranch_choose(list);}}
/>
<Date name="开始日期" today={start_date} setDate={(date)=>setStartDate(date)}/>
<Date name="结束日期" today={due_date} setDate={(date)=>setDueDate(date)}/>
</div>
</Box>
</div>
)
}
export default Form.create()(forwardRef(New));