mirror of
https://github.com/whyour/qinglong.git
synced 2025-05-22 22:36:06 +08:00
暂时去掉 vlist
This commit is contained in:
parent
e05b0a2491
commit
697bcb5922
|
@ -9,6 +9,11 @@
|
|||
url('../assets/fonts/SourceCodePro-Regular.ttf') format('truetype');
|
||||
}
|
||||
|
||||
#root {
|
||||
height: 100vh;
|
||||
height: calc(100vh - var(--vh-offset, 0px));
|
||||
}
|
||||
|
||||
.ant-modal-body {
|
||||
max-height: calc(80vh - 110px);
|
||||
max-height: calc(80vh - var(--vh-offset, 110px));
|
||||
|
@ -349,7 +354,3 @@ pre {
|
|||
white-space: break-spaces !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.virtuallist .ant-table-tbody > tr > td > div {
|
||||
white-space: unset !important;
|
||||
}
|
||||
|
|
|
@ -921,13 +921,6 @@ const Crontab = () => {
|
|||
setViewConf(view ? view : null);
|
||||
};
|
||||
|
||||
const vComponents = useMemo(() => {
|
||||
return VList({
|
||||
height: tableScrollHeight!,
|
||||
resetTopWhenDataChange: false,
|
||||
});
|
||||
}, [tableScrollHeight]);
|
||||
|
||||
return (
|
||||
<PageContainer
|
||||
className="ql-container-wrapper crontab-wrapper ql-container-wrapper-has-tab"
|
||||
|
@ -939,8 +932,6 @@ const Crontab = () => {
|
|||
enterButton
|
||||
allowClear
|
||||
loading={loading}
|
||||
value={searchValue}
|
||||
onChange={(e) => setSearchValue(e.target.value)}
|
||||
onSearch={onSearch}
|
||||
/>,
|
||||
<Button key="2" type="primary" onClick={() => addCron()}>
|
||||
|
@ -1062,7 +1053,6 @@ const Crontab = () => {
|
|||
rowSelection={rowSelection}
|
||||
rowClassName={getRowClassName}
|
||||
onChange={onPageChange}
|
||||
components={vComponents}
|
||||
/>
|
||||
</div>
|
||||
<CronLogModal
|
||||
|
|
119
src/pages/env/index.tsx
vendored
119
src/pages/env/index.tsx
vendored
|
@ -1,10 +1,4 @@
|
|||
import React, {
|
||||
useCallback,
|
||||
useRef,
|
||||
useState,
|
||||
useEffect,
|
||||
useMemo,
|
||||
} from 'react';
|
||||
import React, { useCallback, useRef, useState, useEffect } from 'react';
|
||||
import {
|
||||
Button,
|
||||
message,
|
||||
|
@ -39,8 +33,6 @@ import { useOutletContext } from '@umijs/max';
|
|||
import { SharedContext } from '@/layouts';
|
||||
import useTableScrollHeight from '@/hooks/useTableScrollHeight';
|
||||
import Copy from '../../components/copy';
|
||||
import { VList } from 'virtuallist-antd';
|
||||
|
||||
const { Text } = Typography;
|
||||
const { Search } = Input;
|
||||
|
||||
|
@ -66,6 +58,50 @@ enum OperationPath {
|
|||
|
||||
const type = 'DragableBodyRow';
|
||||
|
||||
const DragableBodyRow = ({
|
||||
index,
|
||||
moveRow,
|
||||
className,
|
||||
style,
|
||||
...restProps
|
||||
}: any) => {
|
||||
const ref = useRef();
|
||||
const [{ isOver, dropClassName }, drop] = useDrop({
|
||||
accept: type,
|
||||
collect: (monitor) => {
|
||||
const { index: dragIndex } = (monitor.getItem() as any) || {};
|
||||
if (dragIndex === index) {
|
||||
return {};
|
||||
}
|
||||
return {
|
||||
isOver: monitor.isOver(),
|
||||
dropClassName:
|
||||
dragIndex < index ? ' drop-over-downward' : ' drop-over-upward',
|
||||
};
|
||||
},
|
||||
drop: (item: any) => {
|
||||
moveRow(item.index, index);
|
||||
},
|
||||
});
|
||||
const [, drag] = useDrag({
|
||||
type,
|
||||
item: { index },
|
||||
collect: (monitor) => ({
|
||||
isDragging: monitor.isDragging(),
|
||||
}),
|
||||
});
|
||||
drop(drag(ref));
|
||||
|
||||
return (
|
||||
<tr
|
||||
ref={ref}
|
||||
className={`${className}${isOver ? dropClassName : ''}`}
|
||||
style={{ cursor: 'move', ...style }}
|
||||
{...restProps}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
const Env = () => {
|
||||
const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
|
||||
const columns: any = [
|
||||
|
@ -331,69 +367,12 @@ const Env = () => {
|
|||
getEnvs();
|
||||
};
|
||||
|
||||
const vComponents = useMemo(() => {
|
||||
return VList({
|
||||
height: tableScrollHeight!,
|
||||
resetTopWhenDataChange: false,
|
||||
});
|
||||
}, [tableScrollHeight]);
|
||||
|
||||
const DragableBodyRow = (props: any) => {
|
||||
const { index, moveRow, className, style, ...restProps } = props;
|
||||
const ref = useRef();
|
||||
const [{ isOver, dropClassName }, drop] = useDrop({
|
||||
accept: type,
|
||||
collect: (monitor) => {
|
||||
const { index: dragIndex } = (monitor.getItem() as any) || {};
|
||||
if (dragIndex === index) {
|
||||
return {};
|
||||
}
|
||||
return {
|
||||
isOver: monitor.isOver(),
|
||||
dropClassName:
|
||||
dragIndex < index ? ' drop-over-downward' : ' drop-over-upward',
|
||||
};
|
||||
},
|
||||
drop: (item: any) => {
|
||||
moveRow(item.index, index);
|
||||
},
|
||||
});
|
||||
const [, drag] = useDrag({
|
||||
type,
|
||||
item: { index },
|
||||
collect: (monitor) => ({
|
||||
isDragging: monitor.isDragging(),
|
||||
}),
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
drop(drag(ref));
|
||||
}, [drag, drop]);
|
||||
|
||||
const components = useMemo(() => vComponents.body.row, []);
|
||||
|
||||
const tempProps = useMemo(() => {
|
||||
return {
|
||||
ref: ref,
|
||||
className: `${className}${isOver ? dropClassName : ''}`,
|
||||
style: { cursor: 'move', ...style },
|
||||
...restProps,
|
||||
};
|
||||
}, [className, dropClassName, restProps, style, isOver]);
|
||||
|
||||
return <> {components(tempProps, ref)} </>;
|
||||
const components = {
|
||||
body: {
|
||||
row: DragableBodyRow,
|
||||
},
|
||||
};
|
||||
|
||||
const components = useMemo(() => {
|
||||
return {
|
||||
...vComponents,
|
||||
body: {
|
||||
...vComponents.body,
|
||||
row: DragableBodyRow,
|
||||
},
|
||||
};
|
||||
}, [vComponents]);
|
||||
|
||||
const moveRow = useCallback(
|
||||
(dragIndex: number, hoverIndex: number) => {
|
||||
if (dragIndex === hoverIndex) {
|
||||
|
|
Loading…
Reference in New Issue
Block a user