build

2020-08-28 11:58:32 +08:00 · 2020-08-28 11:58:32 +08:00 · cccdfeab32
parent 3abbaa8899
commit cccdfeab32
3 changed files with 113 additions and 195 deletions
--- a/src/forge/DevOps/About.jsx
+++ b/src/forge/DevOps/About.jsx
@ -3,8 +3,9 @@ import activate from "../Images/activate.png";
 import { Blueback } from "../Component/layout";
 import styled from "styled-components";
 import { Link } from "react-router-dom";
-import { Form, Input, Modal, Button , Spin } from "antd";
+import { Form, Input , Spin } from "antd";
 import axios from "axios";
+import { ceil } from "lodash";

 const P = styled.p`
   {
@ -19,22 +20,20 @@ const P = styled.p`
 `;
 function About(props, ref) {
  const { form: { getFieldDecorator, validateFields , setFieldsValue } } = props;
-  const [isSpining, setIsSpining] = useState(false);
+  const [isSpining, setIsSpining] = useState(true);
  //0: 标识未开启devops
  //1: 标识用户已填写了云服务器相关信息，但并未开启认证
-  //2: 标识用户已开启了CI服务端的认证
-  //3: 标识用户ci服务已初始化
  const [step, setStep] = useState(undefined);
-  // step等于1时：不能修改服务器信息提示用户去认证
-  const [visible, setVisible] = useState(false);
  // step大于1时：为true，不能再修改服务器信息
  const [firstCompleted, setFirstCompleted] = useState(false);

  const [ redirectUrl ,setRedirectUrl ] = useState(undefined);
-  const [ cloudAccount , setCloudAccount ] = useState(undefined);
+  const [ cloudAccount , setCloudAccount] = useState(undefined);

  const owner = props.match.params.owner;
  const projectsId = props.match.params.projectsId;
+
+
  const AuthorLogin = props.author && props.author.login;
  const CurrentLogin = props.current_user && props.current_user.login;

@ -49,21 +48,10 @@ function About(props, ref) {
      url
    }).then(result=>{
      if(result && result.data ){
-        let s = result.data.step;
-        setStep(s);
-        if(s >= 1){
-          setFirstCompleted(true);
-          if(s===1){
-            setVisible(true);
-          }
-          let cloud_account = result.data.cloud_account;
-          setCloudAccount(cloud_account);
-          setRedirectUrl(cloud_account.authenticate_url);
-          cloud_account && setFieldsValue({
-            ...cloud_account,
-            ip_num:cloud_account.ip 
-          });
-        }
+        setIsSpining(false);
+        setStep(result.data.step);
+        setCloudAccount(result.data.cloud_account);
+        setRedirectUrl(result.data.cloud_account &&result.data.cloud_account.authenticate_url);
      }
    }).catch(error=>{
      console.log(error);
@ -83,122 +71,54 @@ function About(props, ref) {
  );
  // 下一步
  function goStep() {
-    if (!firstCompleted) {
-      setIsSpining(true);
-      props.showNotification("服务器连接绑定中，请耐心等候！");
-      validateFields((error, values) => {
-        if (!error) {
-          const url = `/${owner}/${projectsId}/cloud_accounts.json`;
-          axios.post(url, {...values})
-          .then((result) => {
-            setIsSpining(false);
-            if (result && result.data.redirect_url) {
-              setVisible(true);
-              setFirstCompleted(true);
-              setRedirectUrl(result.data.redirect_url);
-            }
-          })
-          .catch((error) => {
-            console.log(error);
-            setVisible(false);
-          });
-        }
-      });
-    } else {
-      setVisible(true);
-    }
-  }
-  // 弹框确定
-  function sure(){
-    setVisible(false);
-    minusPlus(1);
-    auth('put');
-  }
-
-  function minusPlus(num,flag){
-    let s = 0;
-    if(flag){
-      s=step-num;
-    }else{
-      s=step+num;
-    }
-    setStep(s);
+    setIsSpining(true);
+    props.showNotification("服务器连接绑定中，请耐心等候！");
+    validateFields((error, values) => {
+      if (!error) {
+        const url = `/${owner}/${projectsId}/cloud_accounts.json`;
+        axios.post(url, {...values}).then((result) => {
+          setIsSpining(false);
+          if (result && result.data.redirect_url) {
+            setRedirectUrl(result.data.redirect_url);
+            setStep(1);
+          }
+        })
+        .catch((error) => {
+          console.log(error);
+        });
+      }
+    });
  }

  // 开始激活
  function startActive(){
-    validateFields((error, values) => {
-      if(!error){
-        setIsSpining(true);
-        const url = `/${owner}/${projectsId}/cloud_accounts/${cloudAccount && cloudAccount.id}/activate.json`;
-        axios.post(url,{
-          ...values
-        }).then(result=>{
-          setIsSpining(false);
-          if(result && result.data.status === 0){
-            props.history.push(`/projects/${owner}/${projectsId}/devops/dispose`);
-            // 需要将顶部的open_devops修改
-            let { changeOpenDevops } = props;
-            changeOpenDevops && changeOpenDevops(true);
-          }else{
-            props.showNotification('激活失败，请稍后再试！');
-          }
-        }).catch(error=>{
-          console.log(error);
-        })
+    setIsSpining(true);
+    const url = `/${owner}/${projectsId}/cloud_accounts/${cloudAccount && cloudAccount.id}/activate.json`;
+    axios.post(url).then(result=>{
+      setIsSpining(false);
+      if(result && result.data.status === 0){
+        props.history.push(`/projects/${owner}/${projectsId}/devops/dispose`);
+        // 需要将顶部的open_devops修改
+        let { changeOpenDevops } = props;
+        changeOpenDevops && changeOpenDevops(true);
      }
+    }).catch(error=>{
+      console.log(error);
+      setIsSpining(false);
    })
  }
-  // 完成
-  function complete(){
-    props.history.push(`/projects/${owner}/${projectsId}/devops/dispose`);
-  }
  return (
    <Spin spinning={isSpining}>
      <div className="activatePanel">
-        <Modal
-          title="提示"
-          visible={visible}
-          closable={true}
-          onCancel={() => setVisible(false)}
-          footer={
-            <React.Fragment>
-              <Button onClick={() => setVisible(false)}>取消</Button>
-              <Button
-                onClick={sure}
-                type={"primary"}
-                className="ml20"
-              >
-                确定
-              </Button>
-            </React.Fragment>
-          }
-        >
-          <div style={{ display: "flex", justifyContent: "center" }}>
-            <p style={{ maxWidth: "260px" }}>
-              初始化配置已完成，请前往:
-              <br />
-              <a
-                target="_blank"
-                href={redirectUrl}
-                className="color-blue"
-              >
-                {redirectUrl}
-              </a>
-              <br />
-              进入认证
-            </p>
-          </div>
-        </Modal>
        <img src={activate} alt="" width="250px" />
        <P>定义DevOps工作流，帮助您检测bug、发布代码…</P>
-        <Link to={""} style={{ color: "#5091FF", marginBottom: "20px" }}>
+        <a href={"https://www.trustie.net/forums/82/memos/3080"} target="_blank" style={{ color: "#5091FF", marginBottom: "20px" }}>
          了解什么是DevOps？
-        </Link>
+        </a>
        {
          AuthorLogin === CurrentLogin ? 
          <React.Fragment>
-            { step <= 1 ?
+            { step === 0 ?
            <React.Fragment>
              <Form>
                <p className="mb20" style={{width:"370px"}}>请仔细核对您的服务器信息，一旦确认提交将无法修改</p>
@ -232,32 +152,15 @@ function About(props, ref) {
              <Blueback onClick={goStep}>下一步</Blueback>
            </React.Fragment>
            :""}
-            {step >= 2 &&(
-              <div>
-                <Form>
-                  <p className="mb20" style={{width:"370px"}}>认证成功后，请前往<a target="_blank" href={cloudAccount && cloudAccount.get_drone_token_url} className="color-blue">{cloudAccount && cloudAccount.get_drone_token_url}</a>获取token值，并将获取的token值填入输入框</p>
-                  {helper(
-                    "token值：",
-                    "drone_token",
-                    [{ required: true, message: "请输入token值" }],
-                    <Input placeholder="请输入token值" size="large" />,
-                    true
-                  )}
-                  <div style={{ display: "flex", justifyContent: "center" }}>
-                    {
-                      step === 2?
-                      <Blueback onClick={startActive} className="ml20">开始激活</Blueback>
-                      :
-                      <Blueback onClick={complete}>完成</Blueback>
-                    }
-                  </div>
-                </Form>
+            {step === 1 &&(
+              <div style={{textAlign:'center'}}>
+                <p style={{ maxWidth: "300px",textAlign:"left",color:"#999" }}>初始化配置已完成，请前往:<br/><a target="_blank" href={redirectUrl} className="color-blue">{redirectUrl}</a> 进入认证</p>
+                <Blueback onClick={startActive} className="mt20">开始激活</Blueback>
              </div>
            )}
          </React.Fragment>
          :""
        }
-        
      </div>
    </Spin>
  );
--- a/src/forge/DevOps/OpsDetailRightpanel.jsx
+++ b/src/forge/DevOps/OpsDetailRightpanel.jsx
@ -1,88 +1,105 @@
-import React, {useState,useEffect} from "react";
-import { Spin } from 'antd';
+import React, { useState, useEffect } from "react";
+import { Spin } from "antd";
 import { FlexAJ, AlignCenter } from "../Component/layout";
-import axios from 'axios';
+import axios from "axios";

-export default (({ data , stepN , stageN , projectId , owner , opsId , rightSpin }) => {
-  const [ coders , setCoders ] = useState(undefined);
-  const [ empty , setEmpty ] = useState(false);
-  const [ spining , setSpining ] = useState(true);
-  const [ stage , setStage]= useState(undefined);
-  const [ step , setStep]= useState(undefined);
-  useEffect(()=>{
+export default ({
+  data,
+  stepN,
+  stageN,
+  projectId,
+  owner,
+  opsId,
+  rightSpin,
+}) => {
+  const [coders, setCoders] = useState(undefined);
+  const [empty, setEmpty] = useState(false);
+  const [spining, setSpining] = useState(true);
+  const [stage, setStage] = useState(undefined);
+  const [step, setStep] = useState(undefined);
+  useEffect(() => {
    setSpining(rightSpin);
-  },[rightSpin])
+  }, [rightSpin]);

-  useEffect(()=>{
-    if(data){
+  useEffect(() => {
+    if (data) {
      let stages = data.stages;
-      if(stages && stages.length>0){
-        let pre =  stageN ? stages.filter(item=>item.number===stageN)[0] : stages[0];
+      if (stages && stages.length > 0) {
+        let pre = stageN
+          ? stages.filter((item) => item.number === stageN)[0]
+          : stages[0];
        setStage(pre);
        let p = pre && pre.steps;
-        let sub = stepN ? p && p.length > 0 && p.filter(item=>item.id===stepN)[0] : p[0];
+        let sub = stepN
+          ? p && p.length > 0 && p.filter((item) => item.id === stepN)[0]
+          : p[0];

        setStep(sub);
-        if(sub){
-          getStep(pre.number,sub.number);
+        if (sub) {
+          getStep(pre.number, sub.number);
        }
-      }else{
+      } else {
        setSpining(false);
      }
    }
-  },[data,stageN,stepN])
+  }, [data, stageN, stepN]);

-  function getStep(stageN,stepN){
-    if(stageN && stepN){
+  function getStep(stageN, stepN) {
+    if (stageN && stepN) {
      const url = `/${owner}/${projectId}/builds/${opsId}/logs/${stageN}/${stepN}.json`;
-      axios.get(url).then(result=>{
-        if(result){
-          setCoders(result.data);
-          setSpining(false);
-        }else{
-          setEmpty(true);
-        }
-      }).catch(error=>{
-        console.log(error);
-      })
+      axios
+        .get(url)
+        .then((result) => {
+          if (result) {
+            setCoders(result.data);
+            setSpining(false);
+          } else {
+            setEmpty(true);
+          }
+        })
+        .catch((error) => {
+          console.log(error);
+        });
    }
  }
  return (
    <Spin spinning={spining}>
      <div className="rightMainContent">
-        {
-          data && data.status !== "error" ?
+        {data && data.status !== "error" ? (
          <div>
            <FlexAJ className="items">
              <span>{step && step.name}</span>
              <AlignCenter>
-                { step && step.duration_time}
+                {step && step.duration_time}
                <i className="iconfont icon-sanjiaoxing-down"></i>
              </AlignCenter>
            </FlexAJ>
            <div>
-              {
-                coders && coders.length>0 ? coders.map((item,key)=>{
-                  return(
+              {coders && coders.length > 0 ? (
+                coders.map((item, key) => {
+                  return (
                    <div className="opsDetailOut">
-                      <span>{key+1}</span>
+                      <span>{key + 1}</span>
                      <p>{item.out}</p>
                    </div>
-                  )
-                }):
-                empty ? 
+                  );
+                })
+              ) : empty ? (
                <div className="opsDetailOut">
                  <span>1</span>
-                  <p>{stage && stage.name} – {step && step.name}: Skipped</p>
+                  <p>
+                    {stage && stage.name} – {step && step.name}: Skipped
+                  </p>
                </div>
-                :""
-              }
+              ) : (
+                ""
+              )}
            </div>
          </div>
-          :
-          <div style={{color:"red"}}>error:{ data && data.error }</div>
-        }
+        ) : (
+          <div style={{ color: "red" }}>error:{data && data.error}</div>
+        )}
      </div>
    </Spin>
  );
-});
+};
--- a/src/forge/Newfile/Index.js
+++ b/src/forge/Newfile/Index.js
@ -51,9 +51,7 @@ class Index extends Component {
              <div className="grid-item">
                <div className="setInputAddon">
                  <Input
-                    addonBefore={`/${
-                      projectDetail && projectDetail.identifier
-                    }${urlroot}/`}
+                    addonBefore={`/${ projectDetail && projectDetail.identifier }${urlroot}/`}
                    value={filename}
                    onChange={this.changeFileName}
                    placeholder="命名文件..."