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');
|
url('../assets/fonts/SourceCodePro-Regular.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#root {
|
||||||
|
height: 100vh;
|
||||||
|
height: calc(100vh - var(--vh-offset, 0px));
|
||||||
|
}
|
||||||
|
|
||||||
.ant-modal-body {
|
.ant-modal-body {
|
||||||
max-height: calc(80vh - 110px);
|
max-height: calc(80vh - 110px);
|
||||||
max-height: calc(80vh - var(--vh-offset, 110px));
|
max-height: calc(80vh - var(--vh-offset, 110px));
|
||||||
|
@ -349,7 +354,3 @@ pre {
|
||||||
white-space: break-spaces !important;
|
white-space: break-spaces !important;
|
||||||
padding: 0 !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);
|
setViewConf(view ? view : null);
|
||||||
};
|
};
|
||||||
|
|
||||||
const vComponents = useMemo(() => {
|
|
||||||
return VList({
|
|
||||||
height: tableScrollHeight!,
|
|
||||||
resetTopWhenDataChange: false,
|
|
||||||
});
|
|
||||||
}, [tableScrollHeight]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PageContainer
|
<PageContainer
|
||||||
className="ql-container-wrapper crontab-wrapper ql-container-wrapper-has-tab"
|
className="ql-container-wrapper crontab-wrapper ql-container-wrapper-has-tab"
|
||||||
|
@ -939,8 +932,6 @@ const Crontab = () => {
|
||||||
enterButton
|
enterButton
|
||||||
allowClear
|
allowClear
|
||||||
loading={loading}
|
loading={loading}
|
||||||
value={searchValue}
|
|
||||||
onChange={(e) => setSearchValue(e.target.value)}
|
|
||||||
onSearch={onSearch}
|
onSearch={onSearch}
|
||||||
/>,
|
/>,
|
||||||
<Button key="2" type="primary" onClick={() => addCron()}>
|
<Button key="2" type="primary" onClick={() => addCron()}>
|
||||||
|
@ -1062,7 +1053,6 @@ const Crontab = () => {
|
||||||
rowSelection={rowSelection}
|
rowSelection={rowSelection}
|
||||||
rowClassName={getRowClassName}
|
rowClassName={getRowClassName}
|
||||||
onChange={onPageChange}
|
onChange={onPageChange}
|
||||||
components={vComponents}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<CronLogModal
|
<CronLogModal
|
||||||
|
|
119
src/pages/env/index.tsx
vendored
119
src/pages/env/index.tsx
vendored
|
@ -1,10 +1,4 @@
|
||||||
import React, {
|
import React, { useCallback, useRef, useState, useEffect } from 'react';
|
||||||
useCallback,
|
|
||||||
useRef,
|
|
||||||
useState,
|
|
||||||
useEffect,
|
|
||||||
useMemo,
|
|
||||||
} from 'react';
|
|
||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
message,
|
message,
|
||||||
|
@ -39,8 +33,6 @@ import { useOutletContext } from '@umijs/max';
|
||||||
import { SharedContext } from '@/layouts';
|
import { SharedContext } from '@/layouts';
|
||||||
import useTableScrollHeight from '@/hooks/useTableScrollHeight';
|
import useTableScrollHeight from '@/hooks/useTableScrollHeight';
|
||||||
import Copy from '../../components/copy';
|
import Copy from '../../components/copy';
|
||||||
import { VList } from 'virtuallist-antd';
|
|
||||||
|
|
||||||
const { Text } = Typography;
|
const { Text } = Typography;
|
||||||
const { Search } = Input;
|
const { Search } = Input;
|
||||||
|
|
||||||
|
@ -66,6 +58,50 @@ enum OperationPath {
|
||||||
|
|
||||||
const type = 'DragableBodyRow';
|
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 Env = () => {
|
||||||
const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
|
const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
|
||||||
const columns: any = [
|
const columns: any = [
|
||||||
|
@ -331,69 +367,12 @@ const Env = () => {
|
||||||
getEnvs();
|
getEnvs();
|
||||||
};
|
};
|
||||||
|
|
||||||
const vComponents = useMemo(() => {
|
const components = {
|
||||||
return VList({
|
body: {
|
||||||
height: tableScrollHeight!,
|
row: DragableBodyRow,
|
||||||
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 = useMemo(() => {
|
|
||||||
return {
|
|
||||||
...vComponents,
|
|
||||||
body: {
|
|
||||||
...vComponents.body,
|
|
||||||
row: DragableBodyRow,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}, [vComponents]);
|
|
||||||
|
|
||||||
const moveRow = useCallback(
|
const moveRow = useCallback(
|
||||||
(dragIndex: number, hoverIndex: number) => {
|
(dragIndex: number, hoverIndex: number) => {
|
||||||
if (dragIndex === hoverIndex) {
|
if (dragIndex === hoverIndex) {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user