feat: add gc
Signed-off-by: zhaoxinxin <1186037180@qq.com>
This commit is contained in:
zhaoxinxin
parent
ed32cfe8a4
commit
277b1907d3
|
|
@ -491,7 +491,7 @@ describe('Persistent Cache Tasks', () => {
|
|||
it('when you click refresh, the paginated results and page numbers remain unchanged.', () => {
|
||||
cy.get('#clusters-card').children().should('have.length', 9);
|
||||
|
||||
cy.get(':nth-child(6) > .MuiButtonBase-root').click();
|
||||
cy.get('.MuiPagination-ul > :nth-child(6) > .MuiButtonBase-root').click();
|
||||
|
||||
cy.get('#clusters-card').children().should('have.length', 1);
|
||||
|
||||
|
|
|
|||
|
|
@ -576,7 +576,7 @@ describe('Schedulers', () => {
|
|||
cy.get('#pagination').should('exist');
|
||||
cy.get('#scheduler-pagination > .MuiPagination-ul').children().should('have.length', '8');
|
||||
|
||||
cy.get(':nth-child(6) > .MuiButtonBase-root').click();
|
||||
cy.get('.MuiPagination-ul > :nth-child(6) > .MuiButtonBase-root').click();
|
||||
|
||||
cy.get('#operation-4').click();
|
||||
|
||||
|
|
@ -872,7 +872,7 @@ describe('Schedulers', () => {
|
|||
cy.get('#inactive').should('have.text', 5);
|
||||
});
|
||||
|
||||
it('can Delete inactive instances', () => {
|
||||
it('can delete inactive instances', () => {
|
||||
const schedulers = [
|
||||
43, 42, 41, 40, 39, 38, 37, 36, 35, 34, 33, 32, 29, 30, 31, 28, 27, 26, 25, 23, 24, 10, 11, 12, 13, 14, 15, 21,
|
||||
9, 8, 6, 4, 2, 22,
|
||||
|
|
@ -920,6 +920,7 @@ describe('Schedulers', () => {
|
|||
cy.get('body').click('topLeft');
|
||||
cy.get('#failure').should('not.exist');
|
||||
|
||||
cy.wait(200 * schedulers.length);
|
||||
// Show number of deleted schedulers.
|
||||
cy.get('.MuiAlert-message').should('have.text', 'You have successfully removed 34 inactive schedulers!');
|
||||
|
||||
|
|
|
|||
|
|
@ -636,7 +636,7 @@ describe('Seed peers', () => {
|
|||
cy.get('#table').click();
|
||||
|
||||
// Go to next page.
|
||||
cy.get(':nth-child(6) > .MuiButtonBase-root').click();
|
||||
cy.get('.MuiPagination-ul > :nth-child(6) > .MuiButtonBase-root').click();
|
||||
cy.get('#seed-peer-pagination > .MuiPagination-ul .Mui-selected').should('have.text', '5');
|
||||
|
||||
// Check if the total number of pages is 8.
|
||||
|
|
@ -961,7 +961,7 @@ describe('Seed peers', () => {
|
|||
cy.get('#inactive').should('have.text', 2);
|
||||
});
|
||||
|
||||
it('can Delete inactive instances', () => {
|
||||
it('can delete inactive instances', () => {
|
||||
const seedPeers = [39, 38, 32, 31, 30, 29, 28, 27, 26, 25, 24, 23, 11, 18, 19, 20, 21, 22, 9, 3];
|
||||
|
||||
for (let i = 0; i < seedPeers.length; i++) {
|
||||
|
|
@ -1013,7 +1013,7 @@ describe('Seed peers', () => {
|
|||
|
||||
cy.get('#failure').should('not.exist');
|
||||
|
||||
cy.wait(400 * seedPeers.length);
|
||||
cy.wait(200 * seedPeers.length);
|
||||
// Show number of deleted seed peers.
|
||||
cy.get('.MuiAlert-message').should('have.text', 'You have successfully deleted 20 inactive seed peers!');
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
<svg width="106.11px" height="125px" viewBox="0 0 106.11 125" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="编组" transform="translate(-65.89, -56)" fill="#D3D3D3" fill-rule="nonzero">
|
||||
<path
|
||||
d="M89.5609547,165.084821 C89.4773802,165.337194 89.5296288,165.610934 89.7017246,165.822343 C89.8738204,166.033751 90.1452964,166.157685 90.4331451,166.156262 L145.473718,166.156262 C148.3193,166.156262 145.473718,163.03125 145.473718,163.03125 C144.024191,161.310587 142.423933,159.701086 140.688852,158.21875 C130.85342,149.785275 116.015584,148.56681 104.700036,155.263393 L90.93502,163.40625 C90.2735032,163.798065 89.7862725,164.39327 89.5609547,165.084821 L89.5609547,165.084821 Z M141.68773,77.875 L94.3117124,77.875 C94.3117124,77.875 90.5257239,88.03125 108.525005,98.1875 C108.525005,98.1875 116.106727,102.09375 117.997285,112.25 L117.997285,113.03125 L117.997285,112.25 C118.947436,102.09375 127.474437,98.1875 127.474437,98.1875 C145.473718,88.03125 141.68773,77.875 141.68773,77.875 L141.68773,77.875 Z M137.896869,104.4375 C157.79158,91.9375 160.63229,74.75 160.63229,66.9375 L165.373302,66.9375 C169.159291,66.9375 172,64.59375 172,61.46875 C172,58.34375 169.159291,56 165.373302,56 L72.5166979,56 C68.7307095,56 65.89,58.34375 65.89,61.46875 C65.89,64.59375 68.7307095,66.9375 72.5215705,66.9375 L77.2577104,66.9375 C77.2577104,74.75 80.1032925,91.9375 99.9980039,104.4375 C106.629574,108.34375 110.420435,113.03125 110.420435,118.5 C110.420435,127.09375 100.943283,133.34375 99.9980039,133.34375 C98.1025734,134.125 77.2577104,146.625 77.2577104,170.0625 L72.5215705,170.0625 C68.7307095,170.0625 65.89,172.40625 65.89,175.53125 C65.89,178.65625 68.7307095,181 72.5215705,181 L165.373302,181 C169.159291,181 172,178.65625 172,175.53125 C172,172.40625 169.159291,170.0625 165.373302,170.0625 L160.63229,170.0625 C160.63229,146.625 138.842148,134.125 137.896869,133.34375 C136.946717,132.5625 127.469565,126.3125 127.469565,118.5 C127.469565,113.03125 130.315147,108.34375 137.896869,104.4375 L137.896869,104.4375 Z M123.142721,118.5 C123.142721,129.053571 134.510431,136.357143 135.460583,137.169643 C135.460583,137.169643 156.305446,149.34375 156.305446,172.071429 L80.5077159,172.071429 C80.5077159,149.348214 101.352579,137.169643 101.352579,137.169643 C102.297858,137.169643 113.670441,129.053571 113.670441,118.5 C113.670441,112.004464 109.87958,106.325893 101.352579,101.455357 C84.2985769,89.28125 81.4529949,72.2321429 81.4529949,64.9285714 L156.305446,64.9285714 C156.305446,72.2321429 153.459864,88.46875 135.460583,100.642857 C127.878861,106.325893 123.142721,112.004464 123.142721,118.5 L123.142721,118.5 Z"
|
||||
id="形状"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
|
|
@ -2,7 +2,7 @@ import Lottie from 'lottie-react';
|
|||
import gc from '../assets/lotties/gc.json';
|
||||
|
||||
const Style = {
|
||||
height: '9rem',
|
||||
height: '8rem',
|
||||
width: '100%',
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -22,8 +22,8 @@
|
|||
}
|
||||
|
||||
.descriptionIcon {
|
||||
width: 0.8rem !important ;
|
||||
height: 0.8rem !important;
|
||||
width: 0.9rem !important;
|
||||
height: 0.9rem !important;
|
||||
color: var(--palette-grey-300Channel);
|
||||
}
|
||||
|
||||
|
|
@ -164,3 +164,8 @@
|
|||
height: 1.2rem;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
|
||||
.TTLICon {
|
||||
width: 1.4rem;
|
||||
height: 1.4rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,6 +52,7 @@ import { ReactComponent as GCHeader } from '../../../assets/images/gc/gc-header.
|
|||
import { ReactComponent as Edit } from '../../../assets/images/user/edit.svg';
|
||||
import { ReactComponent as Executions } from '../../../assets/images/resource/task/executions.svg';
|
||||
import { ReactComponent as Failure } from '../../../assets/images/job/preheat/failure.svg';
|
||||
import { ReactComponent as DialogTTL } from '../../../assets/images/gc/dialog-ttl.svg';
|
||||
|
||||
export default function AuditGC() {
|
||||
const [successMessage, setSuccessMessage] = useState(false);
|
||||
|
|
@ -284,59 +285,83 @@ export default function AuditGC() {
|
|||
</Box>
|
||||
<Divider />
|
||||
<DialogContent>
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', mb: '1rem' }}>
|
||||
<Typography variant="body2" fontFamily="mabry-bold" component="div" pr="0.3rem">
|
||||
TTL
|
||||
</Typography>
|
||||
<Tooltip title="Keep the records in this interval" placement="top">
|
||||
<HelpIcon className={styles.descriptionIcon} />
|
||||
</Tooltip>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
|
||||
<Box>
|
||||
<TextField
|
||||
id="audit-ttl-input"
|
||||
name="audit"
|
||||
size="small"
|
||||
variant="outlined"
|
||||
type="number"
|
||||
color="success"
|
||||
sx={{ mr: '0.8rem', width: '7rem' }}
|
||||
value={auditLod}
|
||||
onChange={(e) => {
|
||||
setAuditLod(Number(e.target.value));
|
||||
}}
|
||||
/>
|
||||
<Select
|
||||
size="small"
|
||||
name="auditUnit"
|
||||
color="success"
|
||||
id="audit-unit"
|
||||
value={auditLogTTL}
|
||||
onChange={(e) => {
|
||||
setAudiLogTTL(e.target.value);
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
flexDirection: 'column',
|
||||
}}
|
||||
>
|
||||
{unit.map((item) => (
|
||||
<MenuItem
|
||||
key={item}
|
||||
value={item}
|
||||
sx={{
|
||||
m: '0.3rem',
|
||||
borderRadius: '4px',
|
||||
}}
|
||||
>
|
||||
{item}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
<FormHelperText id="ttl-error" error>
|
||||
{ttlError
|
||||
? auditLogTTL === 'Days'
|
||||
? 'Fill in the number, and the time value must be greater than 0 and less than 30 days.'
|
||||
: 'Fill in the number, the length is 1-1000.'
|
||||
: ''}
|
||||
</FormHelperText>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
borderColor: '#D3D3D3',
|
||||
border: '0.1rem solid #D3D3D3',
|
||||
width: '2.8rem',
|
||||
height: '2.8rem',
|
||||
borderRadius: '0.3rem',
|
||||
mb: '.8rem',
|
||||
}}
|
||||
>
|
||||
<DialogTTL className={styles.TTLICon} />
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', mb: '1rem', justifyContent: 'center' }}>
|
||||
<Typography variant="subtitle1" fontFamily="mabry-bold" component="div" pr="0.3rem" pt="0.1rem">
|
||||
Keep the records in this interval
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', pt: '1rem' }}>
|
||||
<TextField
|
||||
id="audit-ttl-input"
|
||||
name="audit"
|
||||
size="small"
|
||||
variant="outlined"
|
||||
type="number"
|
||||
color="success"
|
||||
sx={{ mr: '1rem', width: '14rem' }}
|
||||
value={auditLod}
|
||||
onChange={(e) => {
|
||||
setAuditLod(Number(e.target.value));
|
||||
}}
|
||||
/>
|
||||
<Select
|
||||
size="small"
|
||||
name="auditUnit"
|
||||
color="success"
|
||||
id="audit-unit"
|
||||
sx={{ width: '14rem' }}
|
||||
value={auditLogTTL}
|
||||
onChange={(e) => {
|
||||
setAudiLogTTL(e.target.value);
|
||||
}}
|
||||
>
|
||||
{unit.map((item) => (
|
||||
<MenuItem
|
||||
key={item}
|
||||
value={item}
|
||||
sx={{
|
||||
m: '0.3rem',
|
||||
borderRadius: '4px',
|
||||
}}
|
||||
>
|
||||
{item}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
<FormHelperText id="ttl-error" error>
|
||||
{ttlError
|
||||
? auditLogTTL === 'Days'
|
||||
? 'Fill in the number, and the time value must be greater than 0 and less than 30 days.'
|
||||
: 'Fill in the number, the length is 1-1000.'
|
||||
: ''}
|
||||
</FormHelperText>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', justifyContent: 'space-between', pt: '2rem' }}>
|
||||
|
|
@ -388,7 +413,7 @@ export default function AuditGC() {
|
|||
{gcIsloading ? (
|
||||
<Box id="execute-loading">
|
||||
<GC />
|
||||
<Typography variant="subtitle1" component="div" fontFamily="mabry-bold" textAlign="center">
|
||||
<Typography variant="subtitle1" component="div" fontFamily="mabry-bold" textAlign="center" mb="1rem">
|
||||
LOADING...
|
||||
</Typography>
|
||||
</Box>
|
||||
|
|
|
|||
|
|
@ -161,3 +161,8 @@
|
|||
height: 1.2rem;
|
||||
margin-right: 0.4rem;
|
||||
}
|
||||
|
||||
.TTLICon {
|
||||
width: 1.4rem;
|
||||
height: 1.4rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,18 +29,15 @@ import {
|
|||
} from '@mui/material';
|
||||
import CheckCircleIcon from '@mui/icons-material/CheckCircle';
|
||||
import ArrowForwardIosSharpIcon from '@mui/icons-material/ArrowForwardIosSharp';
|
||||
import { useCallback, useContext, useEffect, useRef, useState } from 'react';
|
||||
import { useContext, useEffect, useRef, useState } from 'react';
|
||||
import { createGCJob, getConfigs, getConfigsResponse, getGC, getGCReaonse, updateConfig } from '../../../lib/api';
|
||||
import { DEFAULT_PAGE_SIZE, MAX_PAGE_SIZE } from '../../../lib/constants';
|
||||
import styles from './index.module.css';
|
||||
import HelpIcon from '@mui/icons-material/Help';
|
||||
import Card from '../../card';
|
||||
import { formatDuring, formatTime, formatNano, getDatetime, getPaginatedList } from '../../../lib/utils';
|
||||
import { ReactComponent as Loading } from '../../../assets/images/gc/loading.svg';
|
||||
import _ from 'lodash';
|
||||
import { MyContext } from '../../menu';
|
||||
import GC from '../../garbage-collection-animation';
|
||||
import RecyclingIcon from '@mui/icons-material/Recycling';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import DeleteSuccessfullyAnimation from '../../deleted-successfully-animation';
|
||||
import { ReactComponent as DeleteWarning } from '../../../assets/images/cluster/delete-warning.svg';
|
||||
|
|
@ -55,6 +52,7 @@ import { ReactComponent as ErrorLast } from '../../../assets/images/gc/error-las
|
|||
import { ReactComponent as Edit } from '../../../assets/images/user/edit.svg';
|
||||
import { ReactComponent as Executions } from '../../../assets/images/resource/task/executions.svg';
|
||||
import { ReactComponent as Failure } from '../../../assets/images/job/preheat/failure.svg';
|
||||
import { ReactComponent as DialogTTL } from '../../../assets/images/gc/dialog-ttl.svg';
|
||||
|
||||
export default function JobGC() {
|
||||
const [successMessage, setSuccessMessage] = useState(false);
|
||||
|
|
@ -265,7 +263,6 @@ export default function JobGC() {
|
|||
'& .MuiDialog-paper': {
|
||||
minWidth: '32rem',
|
||||
},
|
||||
position: 'absolute',
|
||||
}}
|
||||
>
|
||||
<Box className={styles.gcAuditHeaderWrapper}>
|
||||
|
|
@ -290,15 +287,38 @@ export default function JobGC() {
|
|||
<Divider />
|
||||
<DialogContent>
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', pb: '1rem' }}>
|
||||
<Typography variant="body1" fontFamily="mabry-bold" component="div" pr="0.3rem">
|
||||
TTL
|
||||
</Typography>
|
||||
<Tooltip title="Keep the records in this interval" placement="top">
|
||||
<HelpIcon className={styles.descriptionIcon} />
|
||||
</Tooltip>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
flexDirection: 'column',
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
borderColor: '#D3D3D3',
|
||||
border: '0.1rem solid #D3D3D3',
|
||||
width: '2.8rem',
|
||||
height: '2.8rem',
|
||||
borderRadius: '0.3rem',
|
||||
mb: '.8rem',
|
||||
}}
|
||||
>
|
||||
<DialogTTL className={styles.TTLICon} />
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', mb: '1rem', justifyContent: 'center' }}>
|
||||
<Typography variant="subtitle1" fontFamily="mabry-bold" component="div" pr="0.3rem">
|
||||
Keep the records in this interval
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', pt: '1rem' }}>
|
||||
<TextField
|
||||
id="job-ttl-input"
|
||||
name="job"
|
||||
|
|
@ -306,7 +326,7 @@ export default function JobGC() {
|
|||
variant="outlined"
|
||||
type="number"
|
||||
color="success"
|
||||
sx={{ mr: '0.8rem', width: '7rem' }}
|
||||
sx={{ mr: '1rem', width: '14rem' }}
|
||||
value={job}
|
||||
onChange={(e) => {
|
||||
setJob(Number(e.target.value));
|
||||
|
|
@ -317,6 +337,7 @@ export default function JobGC() {
|
|||
name="auditUnit"
|
||||
color="success"
|
||||
id="job-unit"
|
||||
sx={{ width: '14rem' }}
|
||||
value={jobUnit}
|
||||
onChange={(e) => {
|
||||
setJobUnit(e.target.value);
|
||||
|
|
@ -394,7 +415,7 @@ export default function JobGC() {
|
|||
{gcIsloading ? (
|
||||
<Box id="execute-loading">
|
||||
<GC />
|
||||
<Typography variant="subtitle1" component="div" fontFamily="mabry-bold" textAlign="center">
|
||||
<Typography variant="subtitle1" component="div" fontFamily="mabry-bold" textAlign="center" mb="1rem">
|
||||
LOADING...
|
||||
</Typography>
|
||||
</Box>
|
||||
|
|
|
|||
Loading…
Reference in New Issue