From 074934df46df4ce31cd2ad0a18daae60a8cc487f Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Fri, 14 Nov 2025 15:35:27 +0800
Subject: [PATCH] =?UTF-8?q?feat(componentEnv):=E4=BC=98=E5=8C=96=E7=8E=AF?=
 =?UTF-8?q?=E5=A2=83=E9=85=8D=E7=BD=AE=E5=88=97=E8=A1=A8=E6=9F=A5=E8=AF=A2?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 修改getEnvConfigList方法以支持参数对象传参- 增加环境类型和架构类型的筛选功能
- 添加选中状态管理用于筛选条件回显
- 实现根据选择的环境类型或架构类型动态查询数据
- 为Select组件添加清空功能并绑定筛选逻辑
- 更新页面UI以支持新的筛选交互方式
---
 src/api/componentDeployEnv.ts                 |  4 +--
 .../componentEnv/index.tsx                    | 33 +++++++++++++++++--
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/src/api/componentDeployEnv.ts b/src/api/componentDeployEnv.ts
index 8a7e239..c21ce27 100644
--- a/src/api/componentDeployEnv.ts
+++ b/src/api/componentDeployEnv.ts
@@ -9,8 +9,8 @@ export function submitEnvConfig(params) {
 }
 
 // 环境配置列表
-export function getEnvConfigList(current: string | number, size: string | number) {
-  return axios.get(`${urlPrefix}/componentDeployEnv/page?current=${current}&size=${size}`);
+export function getEnvConfigList(params) {
+  return axios.get(`${urlPrefix}/componentDeployEnv/page`, { params });
 }
 
 // 删除环境配置
diff --git a/src/pages/componentDevelopment/componentEnv/index.tsx b/src/pages/componentDevelopment/componentEnv/index.tsx
index 53b1c60..1491bd1 100644
--- a/src/pages/componentDevelopment/componentEnv/index.tsx
+++ b/src/pages/componentDevelopment/componentEnv/index.tsx
@@ -14,6 +14,8 @@ const ComponentEnv = () => {
   const [visible, setVisible] = useState(false);
   const [data, setData] = useState([]);
   const [editingRecord, setEditingRecord] = useState(null);
+  const [selectedEnvType, setSelectedEnvType] = useState(null); // 选中的环境类型
+  const [selectedArch, setSelectedArch] = useState(null); // 选中的架构类型
 
   const columns: TableColumnProps[] = [
     {
@@ -117,8 +119,17 @@ const ComponentEnv = () => {
     });
   };
 
-  const getEnvList = async () => {
-    const res: any = await getEnvConfigList(1, 10);
+  // 获取环境列表，根据选择的类型和架构进行过滤
+  const getEnvList = async (extraValue?: string, type?: string) => {
+    // 构造查询参数
+    const params: any = {
+      current: 1,
+      size: 10
+    };
+
+    if (extraValue) params[type] = extraValue;
+
+    const res: any = await getEnvConfigList(params);
     if (res.code === 200) setData(res.data.list);
   };
 
@@ -142,6 +153,12 @@ const ComponentEnv = () => {
               <Select
                 placeholder="选择环境类型"
                 style={{ width: 154 }}
+                allowClear
+                value={selectedEnvType}
+                onChange={(value) => {
+                  setSelectedEnvType(value);
+                  getEnvList(value, 'type');
+                }}
               >
                 {envType.map((option, index) => (
                   <Option key={option.id} value={option.id}>
@@ -155,6 +172,12 @@ const ComponentEnv = () => {
               <Select
                 placeholder="选择架构类型"
                 style={{ width: 154 }}
+                allowClear
+                value={selectedArch}
+                onChange={(value) => {
+                  setSelectedArch(value);
+                  getEnvList(value, 'arch');
+                }}
               >
                 {architectureType.map((option, index) => (
                   <Option key={option} value={option}>
@@ -204,3 +227,9 @@ const ComponentEnv = () => {
 };
 
 export default ComponentEnv;
+
+
+
+
+
+