forked from Gitlink/forgeplus-react
130 lines
3.7 KiB
JavaScript
130 lines
3.7 KiB
JavaScript
import React , { forwardRef , useState } from 'react';
|
|
import { Form , Input , Button } from 'antd';
|
|
import MDEditor from "../../../modules/tpm/challengesnew/tpm-md-editor";
|
|
import Upload from "../../Upload/Index";
|
|
import Attachments from "../../Upload/attachment";
|
|
import UploadImg from '../Img/UploadImg.png';
|
|
|
|
function NewPanel(props,ref){
|
|
const [ description , setDescription ] = useState(undefined);
|
|
const [ fileList , setFileList] = useState(undefined);
|
|
const [ attachments , setAttachments ] = useState([]);
|
|
const [ save , setSave ] = useState([]);
|
|
const [ receivers_login , setReceiversLogin ] = useState(undefined);
|
|
|
|
const { createFunc , title , desc , files , onCancel , owner , projectsId } = props;
|
|
|
|
const { form: { getFieldDecorator, validateFields , setFieldsValue } } = props;
|
|
useState(()=>{
|
|
title && setTimeout(()=>{
|
|
setFieldsValue({subject:title});
|
|
desc && onContentChange(desc);
|
|
},100)
|
|
files && setAttachments(files);
|
|
files && setSave(files);
|
|
},[title , desc , files])
|
|
|
|
function onContentChange(value){
|
|
setDescription(value);
|
|
}
|
|
function UploadFunc(f){
|
|
let list = [];
|
|
let arr = [];
|
|
if(save && save.length>0 ){
|
|
arr = save.map(i=>{return i.id});
|
|
}
|
|
list = arr && arr.length>0 ? f.concat(arr) : f ;
|
|
setFileList(list);
|
|
};
|
|
|
|
function deleteLoad(id){
|
|
let arr = [];
|
|
let list = save;
|
|
if(list && list.length>0 ){
|
|
arr = list.filter(i=>i.id !== id);
|
|
}
|
|
setFileList(arr.map(i=>{return i.id}));
|
|
setSave(arr);
|
|
}
|
|
|
|
function changeAtWhoLoginList(loginList){
|
|
let list = new Set(receivers_login);
|
|
loginList.map(item => list.add(item));
|
|
setReceiversLogin(Array.from(list));
|
|
};
|
|
|
|
function sureFunc(){
|
|
validateFields((error,values)=>{
|
|
if (!error) {
|
|
createFunc(values,fileList,receivers_login,description);
|
|
}
|
|
})
|
|
}
|
|
|
|
function cancelFunc(){
|
|
if(onCancel){
|
|
onCancel();
|
|
}else{
|
|
window.history.back(-1);
|
|
}
|
|
}
|
|
return(
|
|
<React.Fragment>
|
|
<Form className="explain">
|
|
<Form.Item>
|
|
{getFieldDecorator("subject",{
|
|
rules:[{required:true,message:"请输入疑修标题"}]
|
|
})(
|
|
<Input placeholder="标题" maxLength={100}/>
|
|
)}
|
|
</Form.Item>
|
|
</Form>
|
|
<div style={{position: 'relative'}}>
|
|
<MDEditor
|
|
placeholder={"请输入描述信息"}
|
|
height={392}
|
|
mdID={"issue-edit-description"}
|
|
initValue={description}
|
|
onChange={onContentChange}
|
|
className="mt20"
|
|
isCanAtme = {true}
|
|
isQuoteIssue={true}
|
|
owner = {owner}
|
|
projectsId = {projectsId}
|
|
changeAtWhoLoginList = {changeAtWhoLoginList}
|
|
></MDEditor>
|
|
</div>
|
|
<div className="pb20">
|
|
<Upload
|
|
className="commentStyle mt20"
|
|
isComplete={true}
|
|
load={UploadFunc}
|
|
icon={
|
|
<img
|
|
src={UploadImg}
|
|
width="58"
|
|
alt=""
|
|
style={{ marginBottom: 15 }}
|
|
/>
|
|
}
|
|
size={100}
|
|
showNotification={props.showNotification}
|
|
/>
|
|
{attachments && attachments.length > 0 &&
|
|
<Attachments
|
|
attachments={attachments}
|
|
showNotification={props.showNotification}
|
|
canDelete={true}
|
|
deleteLoad={deleteLoad}
|
|
></Attachments>
|
|
}
|
|
</div>
|
|
<div style={{display:"flex"}}>
|
|
<Button type="primary" className="operateButton" style={{width:"100px"}} onClick={sureFunc}>{ title ? "保存" :"创建"}</Button>
|
|
<Button className="ml30" style={{width:"100px"}} onClick={cancelFunc}>取消</Button>
|
|
</div>
|
|
</React.Fragment>
|
|
)
|
|
}
|
|
export default forwardRef(NewPanel);
|