diff --git a/src/pages/componentDevelopment/componentList/index.tsx b/src/pages/componentDevelopment/componentList/index.tsx
index bdc440d..1b919f7 100644
--- a/src/pages/componentDevelopment/componentList/index.tsx
+++ b/src/pages/componentDevelopment/componentList/index.tsx
@@ -2,7 +2,8 @@ import React, { useState, useEffect } from 'react';
import styles from './style/index.module.less';
import { Button, Divider, Input, Space, Table, Radio, Pagination, Modal, Message } from '@arco-design/web-react';
import { IconSearch } from '@arco-design/web-react/icon';
-import { exportComponent, getCooperationComponentList, getMyComponentList, remove } from '@/api/componentBase';
+import { getMyComponentList, getCooperationComponentList, remove, exportComponent } from '@/api/componentBase';
+import { getReviewGroupByNew } from '@/api/componentMarket';
import { componentRelease, componentRevoke } from '@/api/componentRelease';
import { ComponentItem } from '@/api/interface';
import AddComponentModal from '@/pages/componentDevelopment/componentList/addComponentModal';
@@ -10,11 +11,10 @@ import HandleButtonGroup from '@/pages/componentDevelopment/componentList/handle
import {
componentStatusConstant,
componentStatusDict,
- publicStatusDict,
- publishStatusDict
+ publicStatus,
+ publicStatusDict, publishStatusConstant, publishStatusDict
} from '@/const/isdp/componentBase';
import dayjs from 'dayjs';
-import { getReviewGroupByNew } from '@/api/componentMarket';
const Group = Radio.Group;
@@ -31,6 +31,7 @@ const GlobalVarContainer = () => {
const [loading, setLoading] = useState(false);
const [visible, setVisible] = useState(false);
const [mode, setMode] = useState<'create' | 'edit' | 'copy'>('create'); // 添加模式状态
+ const [searchValue, setSearchValue] = useState(''); // 添加搜索状态
const menuItems = [
{
@@ -183,9 +184,8 @@ const GlobalVarContainer = () => {
console.log('Share collaboration', row);
}}
onExportComponent={(id) => {
- // TODO: 实现导出组件逻辑
- console.log('Export component', id);
- exportComponent(id);
+ // 实现导出组件逻辑
+ onExportComponent(id);
}}
onStopComponentShow={(row) => {
// TODO: 实现下架组件逻辑
@@ -218,25 +218,41 @@ const GlobalVarContainer = () => {
useEffect(() => {
if (selectedItem === '我的组件' || selectedItem === '协同组件') {
- fetchComponentData();
+ // 当切换菜单或搜索条件变化时,重置到第一页
+ setPagination({
+ ...pagination,
+ currPage: 1
+ });
+ // 延迟执行搜索,确保分页参数已更新
+ setTimeout(() => {
+ fetchComponentData();
+ }, 0);
}
else if (selectedItem === '组件审核') {
fetchComponentReview();
}
- }, [selectedItem, pagination.currPage, pagination.pageSize]);
+ }, [selectedItem, searchValue]); // 添加 searchValue 作为依赖项
- // 获取组件列表数据
- const fetchComponentData = async () => {
+ // 获取组件列表数据,支持传入额外参数
+ const fetchComponentData = async (extraParams: any = {}) => {
setLoading(true);
const apiMap = {
'我的组件': getMyComponentList,
'协同组件': getCooperationComponentList
};
try {
- const res: any = await apiMap[selectedItem]({
+ const params = {
currPage: pagination.currPage,
- pageSize: pagination.pageSize
- });
+ pageSize: pagination.pageSize,
+ ...extraParams
+ };
+
+ // 如果有搜索关键词,则添加到参数中
+ if (searchValue.trim()) {
+ params.name = searchValue.trim();
+ }
+
+ const res: any = await apiMap[selectedItem](params);
setComponentData(res.data.list);
setPagination({
@@ -247,6 +263,7 @@ const GlobalVarContainer = () => {
});
} catch (error) {
console.error('获取组件列表失败:', error);
+ Message.error('获取组件列表失败');
} finally {
setLoading(false);
}
@@ -271,6 +288,43 @@ const GlobalVarContainer = () => {
});
};
+ // 修改分页变化处理函数
+ useEffect(() => {
+ if (selectedItem === '我的组件' || selectedItem === '协同组件') {
+ fetchComponentData();
+ }
+ }, [pagination.currPage, pagination.pageSize]);
+
+ // 搜索处理函数
+ const searchHandle = () => {
+ // 重置到第一页并触发搜索
+ setPagination({
+ ...pagination,
+ currPage: 1
+ });
+ fetchComponentData();
+ };
+
+ // 重置搜索
+ const resetSearch = () => {
+ setSearchValue('');
+ setPagination({
+ ...pagination,
+ currPage: 1
+ });
+ fetchComponentData();
+ };
+
+ // 修改导出组件的回调函数
+ const onExportComponent = async (id) => {
+ try {
+ await exportComponent(id);
+ Message.success('组件导出成功');
+ } catch (error) {
+ console.error('导出组件失败:', error);
+ Message.error('组件导出失败');
+ }
+ };
return (
<>
@@ -296,15 +350,26 @@ const GlobalVarContainer = () => {