feat: 多集群管理列表页增加手动刷新功能

This commit is contained in:
GraceWalk
2022-09-22 15:18:13 +08:00
parent 0d635ad419
commit 39015b5100
14 changed files with 243 additions and 223 deletions

View File

@@ -10,11 +10,6 @@
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.01), 0 3px 6px 3px rgba(0, 0, 0, 0.01), 0 2px 6px 0 rgba(0, 0, 0, 0.03);
// border-radius: 12px;
}
.operate-bar {
display: flex;
justify-content: space-between;
margin-bottom: 12px;
}
}
.acls-edit-drawer {

View File

@@ -1,7 +1,8 @@
import React, { useEffect, useRef, useState } from 'react';
import { Button, Form, Input, Select, Modal, message, ProTable, AppContainer, DKSBreadcrumb, Utils } from 'knowdesign';
import { Button, Form, Input, Select, Modal, message, ProTable, AppContainer, DKSBreadcrumb, Utils, IconFont, Divider } from 'knowdesign';
import ACLsCardBar from '@src/components/CardBar/ACLsCardBar';
import api from '@src/api';
import { tableHeaderPrefix } from '@src/constants/common';
import { useParams } from 'react-router-dom';
import AddACLDrawer, {
ACL_OPERATION,
@@ -205,37 +206,45 @@ const SecurityACLs = (): JSX.Element => {
<ACLsCardBar />
</div>
<div className="security-acls-page-list clustom-table-content">
<div className="operate-bar">
<Form form={form} layout="inline" onFinish={() => getACLs({ page: 1 })}>
<Form.Item name="kafkaUser">
<Input placeholder="请输入 Principal" />
</Form.Item>
<Form.Item name="resourceType">
<Select
placeholder="选择 ResourceType"
options={Object.keys(RESOURCE_TO_OPERATIONS_MAP).map((key) => ({ label: key, value: key }))}
mode="multiple"
maxTagCount="responsive"
allowClear
style={{ width: 200 }}
/>
</Form.Item>
<Form.Item name="resourceName">
<Input placeholder="请输入 Resource" />
</Form.Item>
<Form.Item>
<Button type="primary" ghost htmlType="submit">
</Button>
</Form.Item>
</Form>
<Button
type="primary"
// icon={<PlusOutlined />}
onClick={() => editDrawerRef.current.onOpen(true, getACLs)}
>
ACL
</Button>
<div className={tableHeaderPrefix}>
<div className={`${tableHeaderPrefix}-left`}>
<div className={`${tableHeaderPrefix}-left-refresh`} onClick={() => getACLs()}>
<IconFont className={`${tableHeaderPrefix}-left-refresh-icon`} type="icon-shuaxin1" />
</div>
<Divider type="vertical" className={`${tableHeaderPrefix}-divider`} />
<Form form={form} layout="inline" onFinish={() => getACLs({ page: 1 })}>
<Form.Item name="kafkaUser">
<Input placeholder="请输入 Principal" />
</Form.Item>
<Form.Item name="resourceType">
<Select
placeholder="选择 ResourceType"
options={Object.keys(RESOURCE_TO_OPERATIONS_MAP).map((key) => ({ label: key, value: key }))}
mode="multiple"
maxTagCount="responsive"
allowClear
style={{ width: 200 }}
/>
</Form.Item>
<Form.Item name="resourceName">
<Input placeholder="请输入 Resource" />
</Form.Item>
<Form.Item>
<Button type="primary" ghost htmlType="submit">
</Button>
</Form.Item>
</Form>
</div>
<div className={`${tableHeaderPrefix}-right`}>
<Button
type="primary"
// icon={<PlusOutlined />}
onClick={() => editDrawerRef.current.onOpen(true, getACLs)}
>
ACL
</Button>
</div>
</div>
<ProTable
tableProps={{