style

src/forge/DevOps/Dispose/List.jsx

@@ -10,8 +10,42 @@ const STATUS = {
   killed:"已撤销",
   pending:"准备中"
 }
+function renderTableStatus(status) {
+  switch (status) {
+    case "running":
+      return (
+        <span className="statusTag running">
+          <i className="iconfont icon-yunhangzhong"></i>运行中
+        </span>
+      );
+    case "failure": case 'error':
+      return (
+        <span className="statusTag failed">
+          <i className="iconfont icon-weitongguo"></i>未通过
+        </span>
+      );
+    case "success":
+      return (
+        <span className="statusTag pass">
+          <i className="iconfont icon-yitongguo"></i>已通过
+        </span>
+      );
+    case 'killed':
+      return (
+        <span className="statusTag killed">
+          <i className="iconfont icon-weitongguo"></i>已撤销
+        </span>
+      );
+    case 'pending':
+      return (
+        <span className="statusTag Preparing">
+          <i className="iconfont icon-zhunbeizhong"></i>准备中
+        </span>
+      );
+  }
+}
 function List({ list, operate , projectsId , owner , showModal , deleteFunc }){
-
+  
   const columns = [
     {
       title:"流水线名称",
@@ -61,10 +95,10 @@ function List({ list, operate , projectsId , owner , showModal , deleteFunc }){
       title:"最近构建状态",
       dataIndex:"pipeline_status",
       key:1,
-      width:"10%",
+      width:"12%",
       ellipsis:true,
       render:(txt)=>{
-        return(STATUS[txt])
+        return renderTableStatus(txt)
       }
     },
     {

src/forge/DevOps/Infos.jsx

@@ -1,9 +1,8 @@
-import React , { useEffect , useState , useRef } from 'react';
+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';
 
 import styled from 'styled-components';
 
@@ -11,22 +10,11 @@ const Div = styled.div`{
   padding:24px 30px;
 }`;
 export default ((props)=>{
-  const [ menu , setMenu ] = useState(false);
   const [ permission , setPermission ] = useState("");
-  const childRef = useRef();
 
-  const path = props.location.pathname;
   const owner = props.match.params.owner;
-  const projectsId = props.match.params.projectsId;
 
   const projectDetail = props.projectDetail;
-  useEffect(()=>{
-    if(path === `/projects/${owner}/${projectsId}/devops/list`){
-      setMenu(true);
-    }else{
-      setMenu(false);
-    }
-  },[path])
 
   useEffect(()=>{
     if(projectDetail){
@@ -34,22 +22,13 @@ export default ((props)=>{
     }
   },[projectDetail])
 
-  const updateChildState = () => {
-    // changeVal就是子组件暴露给父组件的方法
-    if (childRef.current) {
-      childRef.current.changeVal();
-    }
-  }
 
   return(
     <div className="disposePanel">
       <Banner>
         { permission !=="Reporter" && <Link to={`/projects/${owner}/${props.match.params.projectsId}/devops/dispose`}>工作流配置</Link>}
-        {/* <Link to={`/projects/${owner}/${props.match.params.projectsId}/devops/list`}className={menu===true && "color-blue"}>构建列表</Link> */}
-        {/* { menu===true && <a onClick={updateChildState} style={{float:"right",fontSize:"14px",color:"#FF6E21",marginTop:"5px"}}>刷新</a>} */}
       </Banner>
       <Div>
-        {/* { menu === true && <Structure {...props}  wrappedComponentRef={(form) => childRef.current = form} ref={childRef}/> } */}
         <Dispost {...props}/>
       </Div>
     </div>

src/forge/DevOps/Manage/Params.jsx

@@ -88,7 +88,6 @@ function Params(props){
       ...values,id
     }).then(result=>{
       if(result){
-        CancelFunc();
         props.showNotification(`${id ? '参数编辑':"新增参数"}成功！`);
         Init();
       }

src/forge/DevOps/Manage/ParamsNew.jsx

@@ -29,15 +29,23 @@ function ParamsNew({ form , visble,successFunc,CancelFunc ,editList }){
     validateFields((error,values)=>{
       if(!error){
         successFunc(values,editList && editList.id);
+        onCancelFunc();
       }
     })
   }
+  function onCancelFunc(){
+    setFieldsValue({
+      name:undefined,
+      data:undefined
+    })
+    CancelFunc();
+  }
   return(
     <Modal
       visible={visble}
       okText={"确定"}
       cancelText={"取消"}
-      onCancel={CancelFunc}
+      onCancel={onCancelFunc}
       onOk={onConfirmFunc}
       title={"新建"}
       closable={false}

src/forge/DevOps/ops.scss

@@ -81,48 +81,7 @@
   .ant-modal-close{
     top:7px;
   }
-  // 列表
-  .listPart{
-    .statusTag{
-      display: flex;
-      padding:0px 16px;
-      height: 32px;
-      line-height: 32px;
-      border-radius:20px;
-      float: left;
-      i{
-        font-size: 20px!important;
-        margin-right: 7px;
-      }
-      &.running{
-        background:#F1F8FF;
-        border:1px solid #5091FF;
-        color: #5091FF;
-      }
-      &.Preparing{
-        background:rgba(255,248,244,1);
-        border:1px solid rgba(255,110,33,1);
-        color:rgba(255,110,33,1) ;
-      }
-      &.pass{
-        background:#EEFDF5;
-        border:1px solid #28BD6C;
-        color:#28BD6C ;
-      }
-      &.failed{
-        background:#FCEEEE;
-        border:1px solid #F73030;
-        color:#F73030 ;
-      }
-      &.killed{
-        background:#eee;
-        border:1px solid #999;
-        color:#999 ;
-      }
-    }
-
-  }
-
+  
 }
 // ops详情
 .opsDetailPanel{
@@ -509,4 +468,41 @@
 }
 .hide{
   display: none!important;
+}
+.statusTag{
+  display: flex;
+  padding:0px 16px;
+  height: 32px;
+  line-height: 32px;
+  border-radius:20px;
+  float: left;
+  i{
+    font-size: 20px!important;
+    margin-right: 7px;
+  }
+  &.running{
+    background:#F1F8FF;
+    border:1px solid #5091FF;
+    color: #5091FF;
+  }
+  &.Preparing{
+    background:rgba(255,248,244,1);
+    border:1px solid rgba(255,110,33,1);
+    color:rgba(255,110,33,1) ;
+  }
+  &.pass{
+    background:#EEFDF5;
+    border:1px solid #28BD6C;
+    color:#28BD6C ;
+  }
+  &.failed{
+    background:#FCEEEE;
+    border:1px solid #F73030;
+    color:#F73030 ;
+  }
+  &.killed{
+    background:#eee;
+    border:1px solid #999;
+    color:#999 ;
+  }
 }