forked from Gitlink/forgeplus-react
81 lines
2.6 KiB
JavaScript
81 lines
2.6 KiB
JavaScript
import React , { forwardRef , useCallback , useState } from 'react';
|
||
import { Form , AutoComplete } from 'antd';
|
||
import { Blueback } from '../Component/layout';
|
||
import Editor from "react-monaco-editor";
|
||
import Modals from './DisposeModal';
|
||
|
||
import docker from '../Images/docker.png';
|
||
import gradle from '../Images/gradle.png';
|
||
import java from '../Images/java.png';
|
||
import js from '../Images/js.png';
|
||
import php from '../Images/php.png';
|
||
import python from '../Images/python.png';
|
||
|
||
|
||
const Option = AutoComplete.Option;
|
||
export default Form.create()(
|
||
forwardRef(({ form })=>{
|
||
const [ visible , setVisible ] = useState(false);
|
||
const { getFieldDecorator } = form;
|
||
const helper = useCallback(
|
||
(label, name, rules, widget, isRequired = false) => (
|
||
<React.Fragment>
|
||
<span required={isRequired}>{label}</span>
|
||
<Form.Item>
|
||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||
</Form.Item>
|
||
</React.Fragment>
|
||
),
|
||
[]
|
||
)
|
||
// 修改文件内容
|
||
function changeEditor(){}
|
||
|
||
// 切换语言
|
||
function changeAuto(){}
|
||
return(
|
||
<React.Fragment>
|
||
<Modals visible={visible} closeFunc={(flag)=>setVisible(flag)}></Modals>
|
||
<Form>
|
||
<p>编程语言：</p>
|
||
<ul className="language">
|
||
<li><img alt="" src={docker} /></li>
|
||
<li><img alt="" src={gradle} /></li>
|
||
<li><img alt="" src={java} /></li>
|
||
<li><img alt="" src={js} /></li>
|
||
<li><img alt="" src={php} /></li>
|
||
<li><img alt="" src={python} /></li>
|
||
</ul>
|
||
{helper(
|
||
"",
|
||
"tag_name",
|
||
[{ required: true, message: "请选择语言" }],
|
||
<AutoComplete
|
||
placeholder="更多语言"
|
||
onChange={changeAuto}
|
||
style={{ width: "300px",margin:"15px 0px" }}
|
||
>
|
||
</AutoComplete>
|
||
)}
|
||
<p>配置脚本：</p>
|
||
<div className="editorBody">
|
||
<p className="editorHead">
|
||
<span>trustie-pipeline.yml</span>
|
||
<a><i className="iconfont icon-bianji6 font-14"></i></a>
|
||
</p>
|
||
<Editor
|
||
height="300px"
|
||
language={"plaintext"}
|
||
theme={"vs-grey"}
|
||
defaultValue="请输入内容"
|
||
value={"editorValue"}
|
||
options={"editor_options"}
|
||
onChange={changeEditor}
|
||
></Editor>
|
||
</div>
|
||
<Blueback>确定提交</Blueback>
|
||
</Form>
|
||
</React.Fragment>
|
||
)
|
||
})
|
||
) |