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;
+
+
+
+
+
+