mirror of
https://github.com/whyour/qinglong.git
synced 2025-05-24 15:43:24 +08:00
修复表格样式
This commit is contained in:
parent
a3044f9d29
commit
a48d100b2d
|
@ -240,7 +240,7 @@ const Dependence = () => {
|
||||||
const [isLogModalVisible, setIsLogModalVisible] = useState(false);
|
const [isLogModalVisible, setIsLogModalVisible] = useState(false);
|
||||||
const [type, setType] = useState('nodejs');
|
const [type, setType] = useState('nodejs');
|
||||||
const tableRef = useRef<HTMLDivElement>(null);
|
const tableRef = useRef<HTMLDivElement>(null);
|
||||||
const tableScrollHeight = useTableScrollHeight(tableRef, 59);
|
const tableScrollHeight = useTableScrollHeight(tableRef, 162);
|
||||||
|
|
||||||
const getDependencies = (status?: number[]) => {
|
const getDependencies = (status?: number[]) => {
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
|
@ -528,46 +528,7 @@ const Dependence = () => {
|
||||||
setType(activeKey);
|
setType(activeKey);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
const children = (
|
||||||
<PageContainer
|
|
||||||
className="ql-container-wrapper dependence-wrapper ql-container-wrapper-has-tab"
|
|
||||||
title={intl.get('依赖管理')}
|
|
||||||
extra={[
|
|
||||||
<Search
|
|
||||||
placeholder={intl.get('请输入名称')}
|
|
||||||
style={{ width: 'auto' }}
|
|
||||||
enterButton
|
|
||||||
loading={loading}
|
|
||||||
onSearch={onSearch}
|
|
||||||
/>,
|
|
||||||
<Button key="2" type="primary" onClick={() => addDependence()}>
|
|
||||||
{intl.get('创建依赖')}
|
|
||||||
</Button>,
|
|
||||||
]}
|
|
||||||
header={{
|
|
||||||
style: headerStyle,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Tabs
|
|
||||||
defaultActiveKey="nodejs"
|
|
||||||
size="small"
|
|
||||||
tabPosition="top"
|
|
||||||
onChange={onTabChange}
|
|
||||||
items={[
|
|
||||||
{
|
|
||||||
key: 'nodejs',
|
|
||||||
label: 'NodeJs',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'python3',
|
|
||||||
label: 'Python3',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 'linux',
|
|
||||||
label: 'Linux',
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
<div ref={tableRef}>
|
<div ref={tableRef}>
|
||||||
{selectedRowIds.length > 0 && (
|
{selectedRowIds.length > 0 && (
|
||||||
<div style={{ marginBottom: 16 }}>
|
<div style={{ marginBottom: 16 }}>
|
||||||
|
@ -615,6 +576,53 @@ const Dependence = () => {
|
||||||
/>
|
/>
|
||||||
</DndProvider>
|
</DndProvider>
|
||||||
</div>
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PageContainer
|
||||||
|
className="ql-container-wrapper dependence-wrapper ql-container-wrapper-has-tab"
|
||||||
|
title={intl.get('依赖管理')}
|
||||||
|
extra={[
|
||||||
|
<Search
|
||||||
|
placeholder={intl.get('请输入名称')}
|
||||||
|
style={{ width: 'auto' }}
|
||||||
|
enterButton
|
||||||
|
loading={loading}
|
||||||
|
onSearch={onSearch}
|
||||||
|
/>,
|
||||||
|
<Button key="2" type="primary" onClick={() => addDependence()}>
|
||||||
|
{intl.get('创建依赖')}
|
||||||
|
</Button>,
|
||||||
|
]}
|
||||||
|
header={{
|
||||||
|
style: headerStyle,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Tabs
|
||||||
|
defaultActiveKey="nodejs"
|
||||||
|
size="small"
|
||||||
|
tabPosition="top"
|
||||||
|
style={{ height: '100%' }}
|
||||||
|
destroyInactiveTabPane
|
||||||
|
onChange={onTabChange}
|
||||||
|
items={[
|
||||||
|
{
|
||||||
|
key: 'nodejs',
|
||||||
|
label: 'NodeJs',
|
||||||
|
children,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'python3',
|
||||||
|
label: 'Python3',
|
||||||
|
children,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'linux',
|
||||||
|
label: 'Linux',
|
||||||
|
children,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
<DependenceModal
|
<DependenceModal
|
||||||
visible={isModalVisible}
|
visible={isModalVisible}
|
||||||
handleCancel={handleCancel}
|
handleCancel={handleCancel}
|
||||||
|
|
|
@ -129,9 +129,9 @@ const Setting = () => {
|
||||||
const [height, setHeight] = useState<number>(0);
|
const [height, setHeight] = useState<number>(0);
|
||||||
|
|
||||||
useResizeObserver(containergRef, (entry) => {
|
useResizeObserver(containergRef, (entry) => {
|
||||||
const _height = entry.target.parentElement?.parentElement?.offsetHeight;
|
const _height = (entry.target as HTMLElement)?.offsetHeight;
|
||||||
if (_height && height !== _height - 110) {
|
if (_height && height !== _height - 101) {
|
||||||
setHeight(_height - 110);
|
setHeight(_height - 101);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -329,7 +329,7 @@ const Setting = () => {
|
||||||
dataSource={dataSource}
|
dataSource={dataSource}
|
||||||
rowKey="id"
|
rowKey="id"
|
||||||
size="middle"
|
size="middle"
|
||||||
scroll={{ x: 1000 }}
|
scroll={{ x: 1000, y: height }}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
/>
|
/>
|
||||||
),
|
),
|
||||||
|
@ -347,7 +347,7 @@ const Setting = () => {
|
||||||
{
|
{
|
||||||
key: 'login',
|
key: 'login',
|
||||||
label: intl.get('登录日志'),
|
label: intl.get('登录日志'),
|
||||||
children: <LoginLog data={loginLogData} />,
|
children: <LoginLog height={height} data={loginLogData} />,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'dependence',
|
key: 'dependence',
|
||||||
|
|
|
@ -67,7 +67,14 @@ const columns = [
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const LoginLog = ({ data }: any) => {
|
const LoginLog = ({
|
||||||
|
data,
|
||||||
|
height,
|
||||||
|
}: {
|
||||||
|
data: Array<object>;
|
||||||
|
height: number;
|
||||||
|
}) => {
|
||||||
|
console.log(height);
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Table
|
<Table
|
||||||
|
@ -76,8 +83,7 @@ const LoginLog = ({ data }: any) => {
|
||||||
dataSource={data}
|
dataSource={data}
|
||||||
rowKey="id"
|
rowKey="id"
|
||||||
size="middle"
|
size="middle"
|
||||||
scroll={{ x: 1000 }}
|
scroll={{ x: 1000, y: height }}
|
||||||
sticky
|
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in New Issue
Block a user