durian
/
forgeplus-react
forked from Gitlink/forgeplus-react
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

样式

This commit is contained in:
caishi 2020-07-15 17:17:31 +08:00
parent a203c2285f
commit c3d80fb588
8 changed files with 212 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/forge/Component/FileLanguage.jsx Normal file
View File

@ -0,0 +1,66 @@
import React from 'react';
import { Select } from 'antd';
const Option = Select.Option;
const LANGUAGE = [
"apex",
"azcli",
"bat",
"clojure",
"coffee",
"cpp",
"csharp",
"csp",
"css",
"dockerfile",
"fsharp",
"go",
"handlebars",
"html",
"ini",
"java",
"javascript",
"json",
"less",
"lua",
"markdown",
"msdax",
"mysql",
"objective",
"perl",
"pgsql",
"php",
"postiats",
"powerquery",
"powershell",
"pug",
"python",
"r",
"razor",
"redis",
"redshift",
"ruby",
"rust",
"sb",
"scheme",
"scss",
"shell",
"solidity",
"sql",
"st",
"swift",
"typescript",
"vb",
"xml",
"yaml",
];
export default (({ language , select_language })=>{
return(
<Select showSearch={true} placeholder={"请选择文本语言"} style={{ width: 200 }} value={language} onChange={select_language}>
<Option value={undefined}>请选择文本语言</Option>
{LANGUAGE.map((item, key) => {
return <Option value={item}>{item}</Option>;
})}
</Select>
)
})

46
src/forge/DevOps/Dispose.jsx
View File

@ -3,6 +3,7 @@ import { Form , AutoComplete } from 'antd';
import { Blueback } from '../Component/layout';
import Editor from "react-monaco-editor";
import Modals from './DisposeModal';
import FileLanguage from '../Component/FileLanguage';
import docker from '../Images/docker.png';
import gradle from '../Images/gradle.png';
@ -16,7 +17,11 @@ const Option = AutoComplete.Option;
export default Form.create()(
forwardRef(({ form })=>{
const [ visible , setVisible ] = useState(false);
const { getFieldDecorator } = form;
const [ ymlValue , setYmlValue ] = useState("class Main 1111");
const [ fileLanguage , setFileLanguage ] = useState(undefined);
const { getFieldDecorator , validateFields } = form;
const helper = useCallback(
(label, name, rules, widget, isRequired = false) => (
<React.Fragment>
@ -29,10 +34,23 @@ export default Form.create()(
[]
)
// 修改文件内容
function changeEditor(){}
function changeEditor(value){
setYmlValue(value);
}
// 切换语言
function changeAuto(){}
function select_language(value){
setFileLanguage(value);
}
// 确定提交
function submit(){
validateFields((error,value)=>{
if(!error){
console.log(value);
}
})
}
return(
<React.Fragment>
<Modals visible={visible} closeFunc={(flag)=>setVisible(flag)}></Modals>
@ -46,34 +64,26 @@ export default Form.create()(
<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>
)}
<div className="mt20 mb20">
<FileLanguage language={fileLanguage} select_language={select_language}/>
</div>
<p>配置脚本：</p>
<div className="editorBody">
<p className="editorHead">
<span>trustie-pipeline.yml</span>
<span>.trustie-pipeline.yml</span>
<a><i className="iconfont icon-bianji6 font-14"></i></a>
</p>
<Editor
height="300px"
language={"plaintext"}
language={"java"}
theme={"vs-grey"}
defaultValue="请输入内容"
value={"editorValue"}
value={ymlValue}
options={"editor_options"}
onChange={changeEditor}
></Editor>
</div>
<Blueback>确定提交</Blueback>
<Blueback onClick={submit}>确定提交</Blueback>
</Form>
</React.Fragment>
)

11
src/forge/DevOps/Infos.jsx
View File

@ -1,5 +1,6 @@
import React , { useEffect , useState } from 'react';
import { Banner } from '../Component/layout';
import { Link } from 'react-router-dom';
import Dispost from './Dispose';
import Structure from './Structure';
@ -12,19 +13,21 @@ const Div = styled.div`{
export default ((props)=>{
const [ menu , setMenu ] = useState(false);
const path = props.location.pathname;
useEffect(()=>{
const path = props.location.pathname;
console.log(props.match.params.projectsId)
if(path === `/projects/${props.match.params.projectsId}/ops/list`){
setMenu(true);
}else{
setMenu(false);
}
},[])
},[path])
return(
<div className="disposePanel">
<Banner>
<span>工作流配置</span>
<span style={{marginLeft:"66px",color:`${ menu ? "#5091FF":"#333" }`}}>构建列表</span>
<Link to={`/projects/${props.match.params.projectsId}/ops/dispose`}>工作流配置</Link>
{ menu ? <Link to={`/projects/${props.match.params.projectsId}/ops/list`} style={{ marginLeft:"66px",color:"#5091FF" }}>构建列表</Link>:""}
</Banner>
<Div>
{

6
src/forge/Main/Detail.js
View File

@ -438,12 +438,12 @@ class Detail extends Component {
</Link>
</li>
}
{/* <li className={url.indexOf("/ops") > -1 ? "active" : ""}>
<li className={url.indexOf("/ops") > -1 ? "active" : ""}>
<Link to={{ pathname: `/projects/${projectsId}/ops`, state }}>
<i className="iconfont icon-gongzuoliu font-13 mr8"></i>工作流
{/* {projectDetail && projectDetail.pull_requests_count ? <span>{projectDetail.pull_requests_count}</span> : ""}
{projectDetail && projectDetail.ops_count ? <span>{projectDetail.ops_count}</span> : ""}
</Link>
</li> */}
</li>
<li className={(url.indexOf("/Milepost") > -1 || url.indexOf("meilpost") > -1) ? "active" : ""}>
<Link to={{ pathname: `/projects/${projectsId}/orders/Milepost`, state }}>
<img alt="" src={img_milepost} width="16" />里程碑

231
src/forge/Order/Milepost.js
View File

@ -157,139 +157,114 @@ class Milepost extends Component {
</Menu>
)
const Paginations = (
<React.Fragment>
{
data && data.versions_count > limit ?
<div className="mt30 mb50 edu-txt-center">
<Pagination simple defaultCurrent={page} total={data && data.versions_count} pageSize={limit} onChange={this.ChangePage}></Pagination>
</div> : ""
}
</React.Fragment>
)
const renderList = () => {
if (data && data.versions && data.versions.length > 0) {
return (
<div>
<div className="tagList">
{
data.versions.length === 0 ? <NoneData></NoneData> : data.versions.map((item, key) => {
return (
<div style={{ display: 'block' }}>
<div className="milepostdiv">
<div className="milepostwidth">
<div className="grid-item width100">
<i className="iconfont icon-lubiaosignpost3 font-12 mr3"></i>
<Link to={`/projects/${projectsId}/orders/${item.id}/MilepostDetail`} className="font-16">{item.name}</Link>
</div>
</div>
</div>
<div className="milepostdiv" style={{ marginTop: 5 }}>
<div className="milepostrighe">
<div className="grid-item mr10">
<i className="iconfont icon-rili font-14 mr5">
</i>
{
item.effective_date ?
<span className="color-red">{item.effective_date}</span>
:
<span className="color-grey-c">暂无截止时间</span>
}
</div>
<div className="grid-item mr10 color-grey-9">
<i className="iconfont icon-issue font-14 mr5"></i>
<span>
{item.open_issues_count}个开启
</span>
</div>
<div className="grid-item mr10 color-grey-9">
<i className="iconfont icon-shanchudiao font-14 mr5"></i>
<span>
{item.close_issues_count}个关闭
</span>
</div>
</div>
{
data && data.user_admin_or_member ?
<div className="milepostleft">
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-bianji3 font-14 mr5"></i>
<Link to={`/projects/${projectsId}/orders/${item.id}/meilpost`} className="color-grey-9">编辑</Link>
</div>
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-yiguanbi1 font-14 mr5"></i>
<a onClick={() => this.updatestatusemile(this.state.status === "closed" ? "open" : "closed", item)} className="color-grey-9">{this.state.status === "closed" ? "开启" : "关闭"}</a>
</div>
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-lajitong font-14 mr5" ></i>
<Popconfirm placement="bottom" title={'是否删除里程碑？'} okText="是" cancelText="否" onConfirm={() => this.closemile(item)}>
<a className="color-grey-9">删除</a>
</Popconfirm>
</div>
</div>
: ''
}
</div>
<div className="milepostdiv" style={{ marginTop: 5 }}>
<div className="textwidth">
<Text
type="secondary"
ellipsis={{ rows: 30, expandable: false, onExpand: Function }}
>
{item.description}</Text>
</div>
</div>
</div>
)
})
}
</div>
</div>
)
} else {
return (
<NoneData _html="暂时还没有相关数据哦!" />
)
}
}
return (
<div className="main">
<div>
<div style={{ display: this.state.display }}>
<div className="tagdiv" >
<span>里程碑{data && data.issue_tags_count}已创建</span>
</div>
<div style={{ display: this.state.display }}>
<div className="tagdiv" >
<span>里程碑{data && data.issue_tags_count}已创建</span>
</div>
<div className="topWrapper">
<div className="topWrapper_type_infos">
<li className={openselect ? "active" : ""} onClick={() => this.opneMilelist(1)}>{data && data.open_count}个开启中</li>
<li className={closeselect ? "active" : ""} onClick={() => this.opneMilelist(2)}>{data && data.closed_count}个已关闭</li>
</div>
<div className="topWrapper_select">
<ul className="topWrapper_select mb-0">
<li>
<Dropdown className="topWrapperSelect" overlay={menu} trigger={['click']} placement="bottomCenter">
<span>排序<Icon type="caret-down" className="ml5" /></span>
</Dropdown>
</li>
</ul>
{
data && data.user_admin_or_member ?
<Link to={`/projects/${projectsId}/orders/meilpost`} className="topWrapper_btn">新的里程碑</Link>
: ''
}
</div>
</div>
{renderList()}
{Paginations}
</div>
<div className="topWrapper">
<div className="topWrapper_type_infos">
<li className={openselect ? "active" : ""} onClick={() => this.opneMilelist(1)}>{data && data.open_count}个开启中</li>
<li className={closeselect ? "active" : ""} onClick={() => this.opneMilelist(2)}>{data && data.closed_count}个已关闭</li>
</div>
<div className="topWrapper_select">
<ul className="topWrapper_select mb-0">
<li>
<Dropdown className="topWrapperSelect" overlay={menu} trigger={['click']} placement="bottomCenter">
<span>排序<Icon type="caret-down" className="ml5" /></span>
</Dropdown>
</li>
</ul>
{
data && data.user_admin_or_member ?
<Link to={`/projects/${projectsId}/orders/meilpost`} className="topWrapper_btn">新的里程碑</Link>
: ''
}
</div>
</div>
{
data && data.versions && data.versions.length > 0
?
<div className="tagList">
{
data.versions.length === 0 ? <NoneData></NoneData> : data.versions.map((item, key) => {
return (
<div style={{ display: 'block' }}>
<div className="milepostdiv">
<div className="milepostwidth">
<div className="grid-item width100">
<i className="iconfont icon-lubiaosignpost3 font-12 mr3"></i>
<Link to={`/projects/${projectsId}/orders/${item.id}/MilepostDetail`} className="font-16">{item.name}</Link>
</div>
</div>
</div>
<div className="milepostdiv" style={{ marginTop: 5 }}>
<div className="milepostrighe">
<div className="grid-item mr10">
<i className="iconfont icon-rili font-14 mr5">
</i>
{
item.effective_date ?
<span className="color-red">{item.effective_date}</span>
:
<span className="color-grey-c">暂无截止时间</span>
}
</div>
<div className="grid-item mr10 color-grey-9">
<i className="iconfont icon-issue font-14 mr5"></i>
<span>
{item.open_issues_count}个开启
</span>
</div>
<div className="grid-item mr10 color-grey-9">
<i className="iconfont icon-shanchudiao font-14 mr5"></i>
<span>
{item.close_issues_count}个关闭
</span>
</div>
</div>
{
data && data.user_admin_or_member ?
<div className="milepostleft">
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-bianji3 font-14 mr5"></i>
<Link to={`/projects/${projectsId}/orders/${item.id}/meilpost`} className="color-grey-9">编辑</Link>
</div>
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-yiguanbi1 font-14 mr5"></i>
<a onClick={() => this.updatestatusemile(this.state.status === "closed" ? "open" : "closed", item)} className="color-grey-9">{this.state.status === "closed" ? "开启" : "关闭"}</a>
</div>
<div className="grid-item mr15 color-grey-9">
<i className="iconfont icon-lajitong font-14 mr5" ></i>
<Popconfirm placement="bottom" title={'是否删除里程碑？'} okText="是" cancelText="否" onConfirm={() => this.closemile(item)}>
<a className="color-grey-9">删除</a>
</Popconfirm>
</div>
</div>
: ''
}
</div>
<div className="milepostdiv" style={{ marginTop: 5 }}>
<div className="textwidth">
<Text type="secondary" ellipsis={{ rows: 30, expandable: false, onExpand: Function }} >{item.description}</Text>
</div>
</div>
</div>
)
})
}
</div>
:<NoneData _html="暂时还没有相关数据哦!" />
}
{
data && data.versions_count > limit ?
<div className="mt30 mb50 edu-txt-center">
<Pagination simple defaultCurrent={page} total={data && data.versions_count} pageSize={limit} onChange={this.ChangePage}></Pagination>
</div> : ""
}
</div>
)
}

7
src/forge/Order/Nav.js
View File

@ -2,12 +2,7 @@ import React , { Component } from "react";
import { NavLink } from 'react-router-dom';
import './order.css'
class Nav extends Component{
constructor(props){
super(props);
this.state={
projectTag: undefined
}
}
render(){
const { projectsId } = this.props.match.params;
return(

9
src/forge/Order/order.css
View File

@ -576,9 +576,6 @@ a.issue-type-button.active:hover {
cursor: pointer;
line-height: 40px;
}
.attachmentsList {
margin-left: 4px;
}
.paper-clip-color {
color: #29bd8b !important;
}
@ -663,8 +660,7 @@ a.issue-type-button.active:hover {
.comment-background {
background: #fff;
border-radius: 4px;
padding: 0 15px 15px;
/* border: 1px solid #f4f4f4; */
padding: 0px 30px;
}
.border-bottom-comment {
border-bottom: 1px solid #eee;
@ -684,7 +680,8 @@ a.issue-type-button.active:hover {
border-radius: 9px;
}
.comment-background .ant-list-item {
padding: 16px;
padding-left: 20px;
box-sizing: border-box;
}
/* .comment-background .ant-list-split .ant-list-item:last-child{border-bottom: 1px solid #e8e8e8;} */
.border-top-e {

2
src/forge/comments/comments.js
View File

@ -502,7 +502,7 @@ class comments extends Component {
</div>
) : (
<div className="mt20">
<div className="comment-background pd10 mb10">
<div className="comment-background">
<Tabs defaultActiveKey="1" className="custom-comment-tabs">
<TabPane
tab={