8x48/KnowStreaming
1
0
Fork 0
mirror of https://github.com/didi/KnowStreaming.git synced 2026-01-04 03:42:08 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: 支持 Zookeeper 模块

Browse Source
This commit is contained in:
GraceWalk
2022-10-28 17:36:15 +08:00
committed by EricZeng
parent 5f6df3681c
commit 941dd4fd65
22 changed files with 1064 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
km-console/packages/layout-clusters-fe/src/components/ChartOperateBar/NodeScope.tsx
View File

@@ -26,7 +26,6 @@ const OptionsDefault = [
const NodeScope = ({ nodeScopeModule, change }: propsType) => {
const {
hasCustomScope,
customScopeList: customList,
scopeName = '',
scopeLabel = '自定义范围',
@@ -129,79 +128,75 @@ const NodeScope = ({ nodeScopeModule, change }: propsType) => {
</Space>
</Radio.Group>
</div>
{hasCustomScope && (
<div className="flx_r">
<h6 className="time_title">{scopeLabel}</h6>
<div className="custom-scope">
<div className="check-row">
<Checkbox className="check-all" indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}>
全选
</Checkbox>
<Input
className="search-input"
suffix={<IconFont type="icon-fangdajing" style={{ fontSize: '16px' }} />}
size="small"
placeholder={searchPlaceholder}
onChange={(e) => setScopeSearchValue(e.target.value)}
/>
</div>
<div className="fixed-height">
<Checkbox.Group style={{ width: '100%' }} onChange={checkChange} value={checkedListTemp}>
<Row gutter={[10, 12]}>
{customList
.filter((item) => item.label.includes(scopeSearchValue))
.map((item) => (
<Col span={12} key={item.value}>
<Checkbox value={item.value}>{item.label}</Checkbox>
</Col>
))}
</Row>
</Checkbox.Group>
</div>
<div className="flx_r">
<h6 className="time_title">{scopeLabel}</h6>
<div className="custom-scope">
<div className="check-row">
<Checkbox className="check-all" indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}>
全选
</Checkbox>
<Input
className="search-input"
suffix={<IconFont type="icon-fangdajing" style={{ fontSize: '16px' }} />}
size="small"
placeholder={searchPlaceholder}
onChange={(e) => setScopeSearchValue(e.target.value)}
/>
</div>
<div className="fixed-height">
<Checkbox.Group style={{ width: '100%' }} onChange={checkChange} value={checkedListTemp}>
<Row gutter={[10, 12]}>
{customList
.filter((item) => item.label.includes(scopeSearchValue))
.map((item) => (
<Col span={12} key={item.value}>
<Checkbox value={item.value}>{item.label}</Checkbox>
</Col>
))}
</Row>
</Checkbox.Group>
</div>
<div className="btn-con">
<Button
type="primary"
size="small"
className="btn-sure"
onClick={customSure}
disabled={checkedListTemp?.length > 0 ? false : true}
>
确定
</Button>
<Button size="small" onClick={customCancel}>
取消
</Button>
</div>
<div className="btn-con">
<Button
type="primary"
size="small"
className="btn-sure"
onClick={customSure}
disabled={checkedListTemp?.length > 0 ? false : true}
>
确定
</Button>
<Button size="small" onClick={customCancel}>
取消
</Button>
</div>
</div>
)}
</div>
</div>
</div>
);
return (
<>
<div id="d-node-scope">
<div className="scope-title">{scopeName}筛选：</div>
<Popover
trigger={['click']}
visible={popVisible}
content={clickContent}
placement="bottomRight"
overlayClassName={`d-node-scope-popover ${hasCustomScope ? 'large-size' : ''}`}
onVisibleChange={visibleChange}
>
<span className="input-span">
<Input
className={isTop ? 'relativeTime d-node-scope-input' : 'absoluteTime d-node-scope-input'}
value={inputValue}
readOnly={true}
suffix={<IconFont type="icon-jiantou1" rotate={90} style={{ color: '#74788D' }}></IconFont>}
/>
</span>
</Popover>
</div>
</>
<div id="d-node-scope">
<div className="scope-title">{scopeName}筛选：</div>
<Popover
trigger={['click']}
visible={popVisible}
content={clickContent}
placement="bottomRight"
overlayClassName="d-node-scope-popover large-size"
onVisibleChange={visibleChange}
>
<span className="input-span">
<Input
className={isTop ? 'relativeTime d-node-scope-input' : 'absoluteTime d-node-scope-input'}
value={inputValue}
readOnly={true}
suffix={<IconFont type="icon-jiantou1" rotate={90} style={{ color: '#74788D' }}></IconFont>}
/>
</span>
</Popover>
</div>
);
};