forked from Gitlink/forgeplus-react
96 lines
3.2 KiB
JavaScript
96 lines
3.2 KiB
JavaScript
import React, { useState , useEffect } from 'react';
|
||
import { Button , List , Pagination , Skeleton } from 'antd';
|
||
import miyao from '../img/miyao_middle_icon.png';
|
||
import axios from 'axios';
|
||
import DeleteBox from './DeleteBox';
|
||
import SSHDetail from './SSHDetail';
|
||
|
||
const limit = 10;
|
||
function SSH(props) {
|
||
const [ list ,setList ] = useState(undefined);
|
||
const [ page , setPage ] = useState(1);
|
||
const [ total , setTotal ] = useState(0);
|
||
const [ id , setId ] = useState(undefined);
|
||
const [ visible , setVisible ] = useState(false);
|
||
const [ visibleDesc , setVisibleDesc ] = useState(false);
|
||
const [ content , setContent ] = useState(undefined);
|
||
|
||
useEffect(()=>{
|
||
Init();
|
||
},[page])
|
||
|
||
function Init() {
|
||
const url = `/public_keys.json`;
|
||
axios.get(url,{
|
||
params:{
|
||
page,limit
|
||
}
|
||
}).then(result=>{
|
||
if(result && result.data){
|
||
setList(result.data.public_keys);
|
||
setTotal(result.data.total_count);
|
||
}
|
||
}).catch(error=>{})
|
||
}
|
||
|
||
function onSuccess() {
|
||
if(id){
|
||
const url = `/public_keys/${id}.json`;
|
||
axios.delete(url).then(result=>{
|
||
if(result && result.data){
|
||
props.showNotification("密钥删除成功！");
|
||
setVisible(false);
|
||
if(page>1 && (list && list.length===1)){
|
||
setPage(page-1);
|
||
}else{
|
||
Init();
|
||
}
|
||
}
|
||
}).catch(error=>{})
|
||
}
|
||
}
|
||
|
||
return(
|
||
<div>
|
||
<DeleteBox visible={visible} onCancel={()=>setVisible(false)} onSuccess={onSuccess}/>
|
||
<SSHDetail visible={visibleDesc} onCancel={()=>setVisibleDesc(false)} desc={content}/>
|
||
<div className="sshHead">
|
||
<span>SSH密钥</span>
|
||
<Button type="primary" size="large" onClick={()=>props.history.push('/settings/SSH/new')}>添加SSH密钥</Button>
|
||
</div>
|
||
{
|
||
list && list.length > 0 &&
|
||
<List>
|
||
{
|
||
list.map((i,k)=>{
|
||
return(
|
||
<List.Item>
|
||
<img src={miyao} alt=""/>
|
||
<div>
|
||
<p className="color-grey-3"><a className="task-hide" style={{display:"block",fontWeight:"500"}} onClick={()=>{setContent(i);setVisibleDesc(true)}}>{i.name}</a></p>
|
||
<p className="task-hide color-grey-6">{i.fingerprint}</p>
|
||
<span className="color-grey-6">添加时间：{i.created_time}</span>
|
||
</div>
|
||
<Button type="danger" onClick={()=>{setId(i.id);setVisible(true)}}>删除</Button>
|
||
</List.Item>
|
||
)
|
||
})
|
||
}
|
||
|
||
</List>
|
||
}
|
||
{
|
||
!list && <Skeleton />
|
||
}
|
||
{
|
||
total > limit &&
|
||
<div className="edu-txt-center mt15">
|
||
<Pagination simple current={page} onChange={(p)=>{setPage(p)}} pageSize={limit} total={total}/>
|
||
</div>
|
||
}
|
||
{ (!list || (list && list.length === 0)) && <p className="mt30 pl20">您还没有添加任何SSH密钥</p> }
|
||
<p className="questionLink"><a href={`https://docs.github.com/en/github/authenticating-to-github/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent`} target="_blank">如何生成SSH密钥？</a></p>
|
||
</div>
|
||
)
|
||
}
|
||
export default SSH; |