新增数据模型选择组件和数据查询页面集成

开发了一个新的数据模型选择组件（ProjectSelect），它允许用户从个人和团队项目中选择一个数据模型。此组件已集成到数据查询页面，为用户提供了在不同数据模型之间切换的选项，增强了用户体验和数据查询效率。

src/components/ProjectSelect/index.tsx

@@ -0,0 +1,87 @@
+import React, { useEffect, useState } from 'react';
+import { Select, message } from 'antd';
+import { pageProject, recentProject } from "@/services/project";
+
+const { Option, OptGroup } = Select;
+
+interface ProjectSelectProps {
+  value?: string;
+  onChange?: (value: string) => void;
+  style?: React.CSSProperties;
+  size?: 'small' | 'middle' | 'large';
+}
+
+interface DataModel {
+  id: string;
+  projectName: string;
+  type: string;
+}
+
+const ProjectSelect: React.FC<ProjectSelectProps> = ({ value, onChange, style, size = 'middle' }) => {
+  const [dataModels, setDataModels] = useState<DataModel[]>([]);
+  const [loading, setLoading] = useState(false);
+
+  useEffect(() => {
+    fetchDataModels();
+  }, []);
+
+  const fetchDataModels = async (searchValue?: string) => {
+    setLoading(true);
+    try {
+      const response = await recentProject({ 
+        page: 1, 
+        limit: 10,
+        projectName: searchValue,
+        order: "updateTime",
+      });
+      if (response && response.data && response.data.records) {
+        setDataModels(response.data.records);
+      }
+    } catch (error) {
+      console.error("Error fetching data models:", error);
+      message.error("Failed to fetch data models");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleSearch = (value: string) => {
+    fetchDataModels(value);
+  };
+
+  const groupedDataModels = dataModels.reduce((acc, model) => {
+    const key = model.type === '1' ? 'personal' : 'team';
+    if (!acc[key]) {
+      acc[key] = [];
+    }
+    acc[key].push(model);
+    return acc;
+  }, {} as { personal: DataModel[], team: DataModel[] });
+
+  return (
+    <Select
+      value={value}
+      onChange={onChange}
+      style={style}
+      size={size}
+      placeholder="选择数据模型"
+      showSearch
+      filterOption={false}
+      onSearch={handleSearch}
+      loading={loading}
+    >
+      <OptGroup label="个人项目">
+        {groupedDataModels.personal?.map(model => (
+          <Option key={model.id} value={model.id}>{model.projectName}</Option>
+        ))}
+      </OptGroup>
+      <OptGroup label="团队项目">
+        {groupedDataModels.team?.map(model => (
+          <Option key={model.id} value={model.id}>{model.projectName}</Option>
+        ))}
+      </OptGroup>
+    </Select>
+  );
+};
+
+export default ProjectSelect;

src/pages/dataQuery/index.tsx

@@ -24,6 +24,7 @@ import type { DataNode } from 'antd/es/tree';
 import { ModalForm, ProFormText } from '@ant-design/pro-components';
 import { FolderOutlined, CodeOutlined, ApiOutlined, BarChartOutlined } from '@ant-design/icons';
 import './style.less';
+import ProjectSelect from '@/components/ProjectSelect';
 
 const {Text} = Typography;
 const {Search} = Input;
@@ -292,9 +293,17 @@ const DataQuery: React.FC<QueryProps> = (props) => {
     setOpen(false);
   };
 
+  const [selectedDataModel, setSelectedDataModel] = useState<string | undefined>(undefined);
+
   const actions = <Space direction="vertical">
     <Space wrap>
-      <a onClick={handleOpen}><span style={{marginRight: 8}}>已选表</span><Badge count={selectedTable?.length}/></a>
+      <span style={{marginRight: 8}}>数据模型</span>
+      <ProjectSelect
+        value={selectedDataModel}
+        onChange={(value) => setSelectedDataModel(value)}
+        style={{ width: 200 }}
+        size="small"
+      />
 
       <span style={{marginRight: 8}}>数据源</span>
       <DataSourceSelect