From d4e9d0128bb8bd2587bed0f10ced2daae23f39c4 Mon Sep 17 00:00:00 2001 From: caishi <1149225589@qq.com> Date: Mon, 27 Jul 2020 18:45:18 +0800 Subject: [PATCH] =?UTF-8?q?=E9=87=8C=E7=A8=8B=E7=A2=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/forge/Component/FileLanguage.jsx | 29 +++- src/forge/DevOps/About.jsx | 8 +- src/forge/DevOps/Dispose.jsx | 208 ++++++++++++++--------- src/forge/DevOps/DisposeModal.jsx | 4 +- src/forge/DevOps/Infos.jsx | 12 +- src/forge/DevOps/Structure.jsx | 68 ++++++-- src/forge/Newfile/UserSubmitComponent.js | 49 +++--- src/forge/Order/MilepostDetail.js | 144 +++++----------- src/forge/Order/order.css | 3 +- src/forge/common/util.js | 2 + 10 files changed, 287 insertions(+), 240 deletions(-) diff --git a/src/forge/Component/FileLanguage.jsx b/src/forge/Component/FileLanguage.jsx index bd531909..177449c4 100644 --- a/src/forge/Component/FileLanguage.jsx +++ b/src/forge/Component/FileLanguage.jsx @@ -1,6 +1,6 @@ -import React from 'react'; +import React , { useState , useEffect } from 'react'; import { Select } from 'antd'; - +import axios from 'axios'; const Option = Select.Option; const LANGUAGE = [ "apex", @@ -54,12 +54,31 @@ const LANGUAGE = [ "xml", "yaml", ]; + export default (({ language , select_language })=>{ + const [ languages , setLanguage ] = useState(undefined); + + useEffect(()=>{ + const url = '/dev_ops/languages.json'; + axios.get(url).then(result=>{ + if(result){ + setLanguage(result.data); + } + }).catch(error=>{ + console.log(error); + }) + },[]) + + function changelanguage(value){ + let array = value ? languages.filter(item=>item.name === value) :undefined; + select_language(value,array && array[0]); + } + return( - - {LANGUAGE.map((item, key) => { - return ; + {languages && languages.map((item, key) => { + return ; })} ) diff --git a/src/forge/DevOps/About.jsx b/src/forge/DevOps/About.jsx index 5c1fd202..d606e71f 100644 --- a/src/forge/DevOps/About.jsx +++ b/src/forge/DevOps/About.jsx @@ -17,6 +17,7 @@ const P = styled.p`{ }`; function About( props , ref){ const { form: { getFieldDecorator , validateFields } } = props; + const helper = useCallback( (label, name, rules, widget, isRequired) => ( @@ -30,15 +31,16 @@ function About( props , ref){ ); function startActive(){ - console.log(props); + let projectsId = props.match.params.projectsId; validateFields((error,values)=>{ if(!error){ const url = `/dev_ops/cloud_accounts.json`; axios.post(url,{ ...values, + project_id:projectsId }).then(result=>{ - if(result){ - + if(result && result.data.redirect_url){ + window.location.href = result.data.redirect_url; } }).catch(error=>{ console.log(error); diff --git a/src/forge/DevOps/Dispose.jsx b/src/forge/DevOps/Dispose.jsx index ec6e0bd4..56e6f388 100644 --- a/src/forge/DevOps/Dispose.jsx +++ b/src/forge/DevOps/Dispose.jsx @@ -1,91 +1,139 @@ -import React , { forwardRef , useCallback , useState } from 'react'; -import { Form , AutoComplete } from 'antd'; +import React , { useState , useEffect } from 'react'; 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'; -import java from '../Images/java.png'; -import js from '../Images/js.png'; -import php from '../Images/php.png'; -import python from '../Images/python.png'; +import axios from 'axios'; -const Option = AutoComplete.Option; -export default Form.create()( - forwardRef(({ form })=>{ - const [ visible , setVisible ] = useState(false); - const [ ymlValue , setYmlValue ] = useState("class Main 1111"); - const [ fileLanguage , setFileLanguage ] = useState(undefined); +function Dispose(props){ + const [ info , setInfo ] = useState(undefined); + const [ visible , setVisible ] = useState(false); + const [ ymlValue , setYmlValue ] = useState(""); + const [ six , setSix ] = useState(undefined); + const [ fileLanguage , setFileLanguage ] = useState(undefined); + const [ first , setFirst ] = useState(false); - const { getFieldDecorator , validateFields } = form; + let projectsId = props.match.params.projectsId; - const helper = useCallback( - (label, name, rules, widget, isRequired = false) => ( - - {label} - - {getFieldDecorator(name, { rules, validateFirst: true })(widget)} - - - ), - [] - ) - // 修改文件内容 - function changeEditor(value){ - setYmlValue(value); - } - - // 切换语言 - function select_language(value){ - setFileLanguage(value); - } - - // 确定提交 - function submit(){ - validateFields((error,value)=>{ - if(!error){ - console.log(value); + useEffect(()=>{ + if(projectsId){ + const url = '/dev_ops/builds/get_trustie_pipeline.json'; + axios.get(url,{ + params:{ + project_id:projectsId } + }).then(result=>{ + if(result && result.data.content){ + setInfo(result.data); + setYmlValue(result.data.content); + setFirst(true); + }else{ + setFirst(false); + } + }).catch(error=>{ + console.log(error); }) } - return( - - setVisible(flag)}> -
-

编程语言:

-
    -
  • -
  • -
  • -
  • -
  • -
  • -
-
- -
-

配置脚本:

-
-

- .trustie-pipeline.yml - -

- -
- 确定提交 -
-
- ) - }) -) \ No newline at end of file + },[]) + + useEffect(()=>{ + const url = '/dev_ops/languages/common.json'; + axios.get(url).then(result=>{ + if(result){ + setSix(result.data); + } + }).catch(error=>{ + console.log(error); + }) + },[]) + + // 修改文件内容 + function changeEditor(value){ + setYmlValue(value); + } + + // 切换语言 + function select_language(value,array){ + setFileLanguage(value); + // console.log(array); + setYmlValue( array && array.content); + } + + // 确定提交 + function submit(){ + let url = ''; + let params = { + branch: "master", + content:ymlValue, + filepath:info && info.name, + message:'' + } + if(first){ + // 为true,则是编辑否则是新建 + url = `/repositories/${projectsId}/update_file.json`; + axios.put(url,{ + ...params, + sha:info && info.sha + }).then(result=>{ + if(result){ + setVisible(true); + } + }).catch(error=>{ + console.log(error); + }) + }else{ + url = `/repositories/${projectsId}/create_file.json`; + axios.post(url,params).then(result=>{ + if(result){ + setVisible(true); + } + }).catch(error=>{ + console.log(error); + }) + } + } + function suresubmit(){ + props.history.push(`/projects/${projectsId}/ops/list`); + } + + return( + + setVisible(flag)} sureFunc={suresubmit}> +

编程语言:

+ { + six && + + } +
+ +
+

配置脚本:

+
+

+ {info && info.name} + +

+ +
+ 确定提交 +
+ ) +} +export default Dispose; \ No newline at end of file diff --git a/src/forge/DevOps/DisposeModal.jsx b/src/forge/DevOps/DisposeModal.jsx index 7514c319..1ef263c7 100644 --- a/src/forge/DevOps/DisposeModal.jsx +++ b/src/forge/DevOps/DisposeModal.jsx @@ -8,7 +8,7 @@ const Div = styled.div`{ text-align:center; color:#333; }` -export default (({visible , closeFunc})=>{ +export default (({visible , closeFunc , suresubmit})=>{ return( { footer={
- +
} onCancel={()=>closeFunc(false)} diff --git a/src/forge/DevOps/Infos.jsx b/src/forge/DevOps/Infos.jsx index 97cdca70..26a4b6e4 100644 --- a/src/forge/DevOps/Infos.jsx +++ b/src/forge/DevOps/Infos.jsx @@ -11,11 +11,11 @@ const Div = styled.div`{ padding:24px 30px; }`; export default ((props)=>{ - const [ menu , setMenu ] = useState(false); + const [ menu , setMenu ] = useState(undefined); const path = props.location.pathname; useEffect(()=>{ - console.log(props.match.params.projectsId) + // console.log(props.match.params.projectsId) if(path === `/projects/${props.match.params.projectsId}/ops/list`){ setMenu(true); }else{ @@ -30,12 +30,8 @@ export default ((props)=>{ { menu ? 构建列表:""}
- { - menu ? - - : - - } + { menu && menu === true && } + { menu && menu === false && }
) diff --git a/src/forge/DevOps/Structure.jsx b/src/forge/DevOps/Structure.jsx index dddd9845..d7bcde6a 100644 --- a/src/forge/DevOps/Structure.jsx +++ b/src/forge/DevOps/Structure.jsx @@ -1,7 +1,10 @@ -import React , { useState } from 'react'; -import { FlexAJ , Blueback } from '../Component/layout'; +import React , { useState , useEffect } from 'react'; +import { FlexAJ , AlignCenter , Blueback } from '../Component/layout'; import { Table , Pagination } from 'antd'; +import { truncateCommitId } from '../common/util'; import styled from 'styled-components'; +import axios from 'axios'; + const STATUS = [ {name:"所有",value:"1"}, {name:"准备中",value:"2"}, @@ -42,11 +45,44 @@ const Img = styled.img`{ width:25px; height:25px; }` -export default (()=>{ +export default ((props)=>{ const [ status ,setStatus ] = useState("1"); const [ page ,setPage ] = useState(1); const [ total ,setTotal ] = useState(10); + const [ data , setData ] = useState(undefined); + let projectsId = props.match.params.projectsId; + + useEffect(()=>{ + if(projectsId){ + const url ='/dev_ops/builds.json'; + axios.get(url,{ + params:{ + project_id:projectsId + } + }).then(result=>{ + if(result){ + let list = result.data && result.data.map((item,key)=>{ + return { + status:item.status, + author:item.sender, + message:{ + branch:item.source, + image:item.author_avatar, + message:item.message, + sha:truncateCommitId(item.after) + }, + started:item.started, + timestamp:item.timestamp + } + }) + setData(list); + } + }).catch(error=>{ + console.log(error); + }) + } + },[]) function ChangeStatus(value){ setStatus(value) @@ -67,7 +103,7 @@ export default (()=>{ ) } function renderStatusBtn(status){ - if(status >1 && status <=3){ + if(status === "failure" || status ==="success"){ return( 重新构建 ) @@ -79,15 +115,15 @@ export default (()=>{ } function renderTableStatus (status){ switch (status){ - case 1: + case "running": return( 运行中 ); - case 2: + case "failure": return ( 未通过 ); - case 3: + case "success": return ( 已通过 ); @@ -138,18 +174,18 @@ export default (()=>{ { meg.branch && 分支{meg.branch}} { meg.sha && {meg.sha}} - + -
{meg.message}
-
+
{meg.message}
+
) } }, { title:'开始时间', - dataIndex:"begin", - key:"begin", + dataIndex:"started", + key:"started", width:"15%", render:(value,item,key)=>{ return ( @@ -159,12 +195,12 @@ export default (()=>{ }, { title:'运行时间', - dataIndex:"run", - key:"run", + dataIndex:"timestamp", + key:"timestamp", width:"15%", render:(value,item,key)=>{ return ( - {value || "--"} + {value || value === 0 ? `${value}s` : "--"} ) } }, @@ -190,7 +226,7 @@ export default (()=>{
{ diff --git a/src/forge/Newfile/UserSubmitComponent.js b/src/forge/Newfile/UserSubmitComponent.js index 0f723ce5..cf6485c0 100644 --- a/src/forge/Newfile/UserSubmitComponent.js +++ b/src/forge/Newfile/UserSubmitComponent.js @@ -39,32 +39,31 @@ class UserSubmitComponent extends Component { this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { const url = `/repositories/${projectsId}/create_file.json`; - axios - .post(url, { - filepath: filename ? filename : path, - branch: branch, - new_branch: submitType === "1" ? values.branchname : undefined, - content, - message: values.desc, - }) - .then((result) => { - this.setState({ isSpin: false }); - if (result.data && result.data.name) { - this.props.showNotification("文件新建成功!"); - if(submitType === "1"){ - const { getTopCount } = this.props; - getTopCount && getTopCount(values.branchname); - } - let url = values.branchname - ? `/projects/${projectsId}/coders?branch=${values.branchname}` - : `/projects/${projectsId}/coders`; - this.props.history.push(url); + axios.post(url, { + filepath: filename ? filename : path, + branch: branch, + new_branch: submitType === "1" ? values.branchname : undefined, + content, + message: values.desc, + }) + .then((result) => { + this.setState({ isSpin: false }); + if (result.data && result.data.name) { + this.props.showNotification("文件新建成功!"); + if(submitType === "1"){ + const { getTopCount } = this.props; + getTopCount && getTopCount(values.branchname); } - }) - .catch((error) => { - this.setState({ isSpin: false }); - console.log(error); - }); + let url = values.branchname + ? `/projects/${projectsId}/coders?branch=${values.branchname}` + : `/projects/${projectsId}/coders`; + this.props.history.push(url); + } + }) + .catch((error) => { + this.setState({ isSpin: false }); + console.log(error); + }); } else { this.setState({ isSpin: false }); } diff --git a/src/forge/Order/MilepostDetail.js b/src/forge/Order/MilepostDetail.js index 079fd425..be4ea87e 100644 --- a/src/forge/Order/MilepostDetail.js +++ b/src/forge/Order/MilepostDetail.js @@ -13,7 +13,6 @@ import axios from 'axios'; * data:列表接口返回的所有数据, * issues:列表数组, * isSpin:加载中, - * search:搜索关键字, * author_id:发布者id, * assigned_to_id:指派给。。。的id, * limit:每页条数, @@ -30,8 +29,8 @@ class MilepostDetail extends Component { data: undefined, issues: undefined, isSpin: true, - search: undefined, author_id: undefined, + status_id: undefined, assigned_to_id: undefined, limit: 15, page: 1, @@ -42,10 +41,10 @@ class MilepostDetail extends Component { openselect: 1, closeselect: undefined, issue_tag_ids: '标签', - tracker_ids: '所有分类', + tracker_ids: '类型', author_ids: '发布人', - assigned_to_ids: '指派人', - priority_ids: '优先度', + assigned_to_ids: '负责人', + status_ids: "状态", done_ratios: '完成度', paix: '排序' } @@ -53,7 +52,8 @@ class MilepostDetail extends Component { componentDidMount = () => { this.getSelectList(); - this.getIssueList(); + const { page } = this.state; + this.getIssueList(page); } getSelectList = () => { @@ -71,14 +71,20 @@ class MilepostDetail extends Component { } // 获取列表数据 - getIssueList = (page, limit, search, author_id, assigned_to_id, status_type, id, value, order_name, order_type) => { + getIssueList = ( page , item , value , update , updateValue ) => { const { projectsId, meilid } = this.props.match.params; + const { limit , order_name , order_type , issue_tag_id , author_id , assigned_to_id , tracker_id , status_id , done_ratio} = this.state; const url = `/projects/${projectsId}/versions/${meilid}.json`; + let params = update ? { + page, limit , order_name:value , order_type:updateValue , issue_tag_id , + author_id , assigned_to_id , tracker_id , status_id , done_ratio, + }:{ + page, limit , order_name , order_type , issue_tag_id , + author_id , assigned_to_id , tracker_id , status_id , done_ratio, + [item]:value + } axios.get(url, { - params: { - page, limit, search, author_id, assigned_to_id, status_type, order_name, order_type, - [id]: value - } + params: params }).then((result) => { if (result) { this.setState({ @@ -94,85 +100,41 @@ class MilepostDetail extends Component { } getOption = (e, id, name) => { - if (id + 's' === "issue_tag_ids") { - this.setState({ - [id]: e.key, - issue_tag_ids: name - }) - } - if (id + 's' === "tracker_ids") { - this.setState({ - [id]: e.key, - tracker_ids: name - }) - } - if (id + 's' === "author_ids") { - this.setState({ - [id]: e.key, - author_ids: name - }) - } - if (id + 's' === "assigned_to_ids") { - this.setState({ - [id]: e.key, - assigned_to_ids: name - }) - } - if (id + 's' === "priority_ids") { - this.setState({ - [id]: e.key, - priority_ids: name - }) - } - if (id + 's' === "done_ratios") { - this.setState({ - [id]: e.key, - done_ratios: name - }) - } - + console.log(e.key); if (e.key === "created_on") { if (e.item.props.value === "desc") { this.setState({ - [id]: e.key, paix: '最新创建' }) } else { this.setState({ - [id]: e.key, paix: '最早创建' }) } } else if (e.key === "updated_on") { if (e.item.props.value === "desc") { this.setState({ - [id]: e.key, paix: '最新更新' }) } else { this.setState({ - [id]: e.key, paix: '最早更新' }) } } this.setState({ - [id]: e.key + [id]: e.key, + [id+"s"]:name, + page:1 }) - - - const { page, limit, search, author_id, assigned_to_id, status_type } = this.state; - if (e.key === "all") { - this.getIssueList(page, limit, search, author_id, assigned_to_id, status_type, id); - } else if (e.key === "created_on" || e.key === "updated_on") { + if (e.key === "created_on" || e.key === "updated_on") { this.setState({ order_name: e.key, order_type: e.item.props.value }) - this.getIssueList(page, limit, search, author_id, assigned_to_id, status_type, id, undefined, undefined, e.key, e.item.props.value); - } - else { - this.getIssueList(page, limit, search, author_id, assigned_to_id, status_type, id, e.key); + this.getIssueList(1,id,e.key,true,e.item.props.value); + }else{ + this.getIssueList(1,id,e.key); } } @@ -197,23 +159,12 @@ class MilepostDetail extends Component { page, isSpin: true }) - const { limit, search, status_type, author_id, assigned_to_id } = this.state; - this.getIssueList(page, limit, search, author_id, assigned_to_id, status_type); - } - - // 搜索 - searchFunc = (value) => { - this.setState({ - search: value, - isSpin: true - }) - const { page, limit, status_type, author_id, assigned_to_id } = this.state; - this.getIssueList(page, limit, value, author_id, assigned_to_id, status_type); + const { limit, status_type, author_id, assigned_to_id } = this.state; + this.getIssueList(page); } openorder = (type) => { if (type) { - const { current_user } = this.props; if (type === 1) { this.setState({ @@ -221,14 +172,14 @@ class MilepostDetail extends Component { openselect: current_user.user_id, closeselect: undefined, issue_tag_ids: '标签', - tracker_ids: '所有分类', + tracker_ids: '类型', author_ids: '发布人', - assigned_to_ids: '指派人', - priority_ids: '优先度', + assigned_to_ids: '负责人', + status_ids: "状态", done_ratios: '完成度', paix: '排序' }) - this.getIssueList("", "", "", "", "", 1, ""); + this.getIssueList(1); } else { this.setState({ @@ -236,27 +187,18 @@ class MilepostDetail extends Component { openselect: undefined, closeselect: current_user.user_id, issue_tag_ids: '标签', - tracker_ids: '所有分类', + tracker_ids: '类型', author_ids: '发布人', - assigned_to_ids: '指派人', - priority_ids: '优先度', + assigned_to_ids: '负责人', + status_ids: "状态", done_ratios: '完成度', paix: '排序' }) - this.getIssueList("", "", "", "", "", 2, ""); + this.getIssueList(1); } } } - Paginations = (search_count) => { - const { limit, page } = this.state; - if(search_count > limit) - return
- -
; - }; - - render() { const { issue_chosen, issues, limit, page, search_count, data, isSpin, openselect, closeselect } = this.state; @@ -320,13 +262,13 @@ class MilepostDetail extends Component {
  • - + {this.state.tracker_ids}
  • - - {this.state.priority_ids} + + {this.state.status_ids}
  • @@ -347,13 +289,17 @@ class MilepostDetail extends Component { : issues && issues.length>0 && issues.map((item,key)=>{ return( - + ) }) } - {this.Paginations(search_count)} + { + search_count > limit? +
    + +
    :"" + } - ) } diff --git a/src/forge/Order/order.css b/src/forge/Order/order.css index d7be6537..cedf4029 100644 --- a/src/forge/Order/order.css +++ b/src/forge/Order/order.css @@ -181,10 +181,9 @@ height: 30px; } .title_overflow { - max-width: 220px; + max-width: 160px; white-space: nowrap; overflow: hidden; - display: inline-flex; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; diff --git a/src/forge/common/util.js b/src/forge/common/util.js index 8ea1c595..86a0a911 100644 --- a/src/forge/common/util.js +++ b/src/forge/common/util.js @@ -2,5 +2,7 @@ export function truncateCommitId(str) { if (str && str.length > 11) { return str.substring(0, 10) + }else{ + return undefined } }