修改邀请

2022-06-17 17:50:30 +08:00 · 2022-06-17 17:50:30 +08:00 · 53869f95fa
parent 5d3f6dd714
commit 53869f95fa
5 changed files with 155 additions and 32 deletions
--- a/src/AppConfig.js
+++ b/src/AppConfig.js
@ -25,7 +25,7 @@ if (isDev) {
  }
  debugType = window.location.search.indexOf('debug=t') !== -1 ? 'teacher' :
  window.location.search.indexOf('debug=s') !== -1 ? 'student' :
-  window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || 'admin'
+  window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || 'student'
 }                 
 window._debugType = debugType;
 export function initAxiosInterceptors(props) {
@ -89,8 +89,13 @@ export function initAxiosInterceptors(props) {

    if (response.data.status === 404) {
      let responseURL = response.request ? response.request.responseURL:'';
+      // 组织和个人的拥有情况，404不跳转
      if (responseURL.indexOf('/api/users/') === -1 && responseURL.indexOf('/api/organizations/') === -1 ) {
-        locationurl('/nopage');
+        // 邀请页面不进行404跳转
+        if( window.location.pathname.includes('/invite') && (responseURL.includes('/simple.json')||responseURL.includes('/detail.json')||responseURL.includes('/menu_list.json'))){
+        }else{
+          locationurl('/nopage');
+        }
      }
    }

--- a/src/forge/Invite/Index.js
+++ b/src/forge/Invite/Index.js
@ -2,26 +2,47 @@ import React, { useState } from 'react';
 import { Modal, Button } from 'antd';
 import { Base64 } from 'js-base64';
 import './index.scss';
+import { Link } from 'react-router-dom';
+import { getImageUrl } from 'educoder'
+import axios from 'axios';

-function Invite({history,current_user}) {
-    if(!current_user.login){
-        let {pathname,search}=window.location;
-        window.location.href=`/login?go_page=/${pathname}${search}`;
+const identify = {
+    manager: "管理员",
+    developer: "开发人员",
+    reporter: "报告者"
+}
+function Invite({ history, current_user }) {
+    if (!current_user.login) {
+        let { pathname, search } = window.location;
+        window.location.href = `/login?go_page=${pathname}${search}`;
    }
-    let inviteString=window.location.search&&window.location.search.split('?invite=')[1];
-    let inviteParams=inviteString&&JSON.parse(Base64.decode(inviteString));
-    console.log(inviteParams)
+    let inviteString = window.location.search && window.location.search.split('?invite=')[1];
+    let data = inviteString && JSON.parse(Base64.decode(inviteString));
    const [visible, setVisible] = useState(true);

    function accept() {
+        const url = `/users/${current_user.login}/applied_projects/${data.id}/accept.json`;
+        axios.get(url).then(res => {
+            if (res && res.data) {
+                console.log(res)
+            }
+        }).catch(error => { })
+    }

+    function refuse() {
+        const url = `/users/${current_user.login}/applied_projects/${data.id}/refuse.json`;
+        axios.get(url).then(res => {
+            if (res && res.data) {
+                console.log(res)
+            }
+        }).catch(error => { })
    }
    return (
        <div className="">
-            <Modal
+            {data && <Modal
                visible={visible}
                className="invite_development"
-                title="提示"
+                title={<div className="ownerImage"><img src={getImageUrl(data.ownerImage)} /></div>}
                width="548px"
                closable={true}
                onCancel={() => setVisible(false)}
@ -29,11 +50,15 @@ function Invite({history,current_user}) {
                okText={'接受'}
                cancelText={'拒绝'}
                onOk={accept}
+                onCancel={refuse}
+            // icon={<i className="iconfont icon-shanchuicon"></i>}
            >
-                <div className="">
-                    {/* <Button type="primary" onClick={accept}>接受</Button> */}
+                <Link className="invite_project link" target="_blank" to={`/${data.ownerLogin}/${data.projectId}`}>{data.ownerName}/{data.projectName}</Link>
+                <div className="invite_content">
+                    <Link className="link" to={`/${data.userLogin}`}>{data.userName}</Link> 邀请您以{identify[data.role]}的身份加入此代码库
+                    是否接受邀请？
                </div>
-            </Modal>
+            </Modal>}
        </div>
    )
 }
--- a/src/forge/Invite/index.scss
+++ b/src/forge/Invite/index.scss
@ -1,4 +1,5 @@
 .invite_development {
+  font-family: PingFang SC;
  height: 366px;
  background-image: linear-gradient(
    359.37deg,
@ -9,12 +10,68 @@
  border: 1.5px solid #ffffff;
  border-radius: 4px;

-  .ant-modal-content{
-      background-color: inherit;
+  .ant-modal-close{
+    top:0 !important;
  }
-  .ant-modal-header{
-      background: inherit;
-      border:0;
+  .ant-modal-close-x{
+    font-size: 30px;
+    color: #666;
+    width: 48px;
+    height: 48px;
+    line-height: 48px;
+    transform: scaleX(1.05);
+  }
+  .ant-modal-content {
+    background-color: inherit;
+  }
+  .ant-modal-header {
+    background: inherit;
+    border: 0;
+    padding-bottom: 0;
+  }
+  .ownerImage {
+    position: relative;
+    top:-66px;
+    width: 100px;
+    height: 100px;
+    background-color: #e9f1ff;
+    border: 1px solid  #ffffff;
+    border-radius: 50%;
+    margin:0 auto;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    img{
+      width: 100%;
+    }
+  }
+  .invite_project {
+    display: block;
+    margin: 0 auto;
+    font-weight: 500;
+    font-size: 20px;
+    line-height: 22px;
+    text-align: center;
+    margin-bottom: 30px;
+  }
+  .invite_content {
+    width: 422px;
+    padding: 24px 48px;
+    background-color: rgba(225, 231, 255, 0.71);
+    border-radius: 4px 4px 0px 0px;
+    margin: 10px auto;
+    font-weight: 500;
+    font-size: 17px;
+    line-height: 32px;
+    text-align: center;
+    color: #151d40;
+  }
+  .link {
+    cursor: pointer;
+    color: $primary-color;
+    &:hover {
+      color: $primary-color-hover;
+    }
  }
  .ant-modal-footer {
    text-align: center;
@ -23,6 +80,17 @@
    button {
      width: 150px;
      height: 42px;
+      border-radius: 5px;
+      font-size: 15px;
+      &:first-child {
+        background-color: rgba(196, 0, 14, 0.07);
+        border: 1px solid;
+        border-color: #f60011;
+        color: #f60011;
+        &:hover {
+          opacity: 0.75;
+        }
+      }
      & + button {
        margin-left: 30px;
      }
--- a/src/forge/Main/Detail.js
+++ b/src/forge/Main/Detail.js
@ -178,7 +178,7 @@ function checkPathname(projectsId, owner, pathname) {
      name = "wiki"
    } else if (url.indexOf(`/server`) > -1) {
      name = "server"
-    } 
+    }
  }
  return name;
 }
@ -368,7 +368,20 @@ class Detail extends Component {
    axios.get(url).then((result) => {
      if (result && result.data) {
        if (result.data.status === 404) {
-          this.props.history.push('/nopage');
+          if (window.location.pathname.includes('/invite')) {
+            let inviteString = window.location.search && window.location.search.split('?invite=')[1];
+            let data = inviteString && JSON.parse(Base64.decode(inviteString));
+            // this.setState({
+            //   project: { author: { login:data. } }
+            // });
+            // {project && project.author &&
+            //   <Link to={`/${project.author.login}`}>{project.author.name}</Link>
+            // }
+            // <span className="ml5 mr5">/</span>
+            // <Link to={`/${owner}/${projectsId}`} className="projectN mt6">{projectDetail && projectDetail.name}</Link>
+          } else {
+            this.props.history.push('/nopage');
+          }
        }
        this.setState({
          projectDetail: result.data,
--- a/src/forge/Settings/CollaboratorMemberByLink.jsx
+++ b/src/forge/Settings/CollaboratorMemberByLink.jsx
@ -18,26 +18,38 @@ function CollaboratorMemberByLink({ projectsId, owner, project_id, author, showN
  const [role, setRole] = useState('developer');
  const [is_apply, setIs_apply] = useState(true);
  const [inviteUrl, setinviteUrl] = useState('dddd');
-  const [copy,setCopy]=useState(false);
+  const [copy, setCopy] = useState(false);

  useEffect(() => {
    const url = `/${owner}/${projectsId}/project_invite_links/generate_link.json`;
    axios.post(url, {
-        role,
-        is_apply
+      role,
+      is_apply
    }).then(res => {
-      if (res&&res.data) {
-        console.log(res.data);
-        let urlParams=JSON.stringify(res.data);
-        let content=Base64.encode(urlParams);
-        
+      if (res && res.data) {
+        let params = {
+          id:res.data.id,
+          projectName: res.data.project.name,
+          projectId: res.data.project.identifier,
+          is_apply: res.data.is_apply,
+          role: res.data.role,
+          is_public: res.data.project.is_public,
+          ownerImage: res.data.project.owner.image_url,
+          ownerLogin: res.data.project.owner.login,
+          ownerName: res.data.project.owner.name,
+          userName: res.data.user.name,
+          userLogin:res.data.user.login,
+        };
+        let urlParams = JSON.stringify(params);
+        let content = Base64.encode(urlParams);
+
        setinviteUrl(`${window.location.origin}/${owner}/${projectsId}/invite?invite=${content}`);
        setCopy(false);
      }
    }).catch(error => { })
-  }, [role,is_apply]);
+  }, [role, is_apply]);

-  function inviteClick(){
+  function inviteClick() {
    const copyEle = document.querySelector('#inviteUrl'); // 获取要复制的节点
    if (!copyEle) {
      console.error("您的CopyTool未设置正确的inputId");
@ -66,7 +78,7 @@ function CollaboratorMemberByLink({ projectsId, owner, project_id, author, showN
        id="inviteUrl"
        value={inviteUrl}
        readOnly
-        addonAfter={<Button type='primary' onClick={ inviteClick}>{copy?'复制成功':'复制链接'}</Button>} className='linkBox'
+        addonAfter={<Button type='primary' onClick={inviteClick}>{copy ? '复制成功' : '复制链接'}</Button>} className='linkBox'
      />
      <div className='tipBox mt25'>
        <div>注: </div>