diff --git a/src/pages/orchestration/event/index.tsx b/src/pages/orchestration/event/index.tsx index 6efcc13..ce60ac5 100644 --- a/src/pages/orchestration/event/index.tsx +++ b/src/pages/orchestration/event/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useState, useMemo } from 'react'; import styles from './style/index.module.less'; import { Button, @@ -129,8 +129,27 @@ const HandleModal = ({ visible, onChangeVisible, onRefresh }) => { const EventContainer = () => { const [eventData, setEventData] = useState([]); const [visible, setVisible] = useState(false); + const [searchValue, setSearchValue] = useState(''); const { info } = useSelector((state: any) => state.ideContainer); + // 根据搜索值过滤事件数据 + const filteredEventData = useMemo(() => { + if (!searchValue) return eventData; + + return eventData.filter(item => { + const name = item.name || ''; + const topic = item.topic || ''; + const desc = item.description || ''; + + const searchLower = searchValue.toLowerCase(); + return ( + name.toLowerCase().includes(searchLower) || + topic.toLowerCase().includes(searchLower) || + desc.toLowerCase().includes(searchLower) + ); + }); + }, [eventData, searchValue]); + const columns: TableColumnProps[] = [ { title: '序号', @@ -217,6 +236,23 @@ const EventContainer = () => { if (res && res.code === 200) setEventData(res.data.filter(item => !item.topic.includes('**empty**'))); }; + // 处理搜索输入变化 + const handleSearchChange = (value: string) => { + setSearchValue(value); + }; + + // 处理搜索,这里可以添加防抖等优化 + const handleSearch = () => { + // 搜索逻辑已经在 useMemo 中实现 + }; + + // 处理回车键搜索 + const handleKeyPress = (e: React.KeyboardEvent) => { + if (e.key === 'Enter') { + handleSearch(); + } + }; + useEffect(() => { if (info.id) { fetchEventData(); @@ -234,6 +270,9 @@ const EventContainer = () => { prefix={} placeholder={'搜索'} style={{ width: 236 }} + value={searchValue} + onChange={handleSearchChange} + onPressEnter={handleSearch} />