fix: some type error

frontend/packages/core/src/pages/aiSetting/constants.ts

@@ -2,6 +2,6 @@ export const LAYOUT = {
   SERVICE_NODE_X: 50,
   NODE_START_Y: 20,
   NODE_GAP: 120,
-  MODEL_NODE_X: 500,
+  MODEL_NODE_X: 300,
   KEY_NODE_X: 900,
 } as const;

frontend/packages/core/src/pages/keySettings/components/ApiKeyModal.tsx

@@ -1,7 +1,8 @@
 import { $t } from '@common/locales'
-import { DatePicker, Form, Input, Modal, Switch, theme, Typography } from 'antd'
+import { DatePicker, Form, Input, Modal, Switch } from 'antd'
 import dayjs from 'dayjs'
 import React, { useEffect, useState } from 'react'
+import { APIKey } from '..'
 
 interface ApiKeyModalProps {
   visible: boolean
@@ -9,17 +10,11 @@ interface ApiKeyModalProps {
   onSave: (values: any) => void
   vendorName: string
   mode: 'add' | 'edit'
-  initialValues?: {
-    keyName?: string
-    apiKey?: any
-    expirationDate?: string
-    enabled?: boolean
-  }
+  initialValues?: Partial<APIKey>
   defaultKeyNumber?: number
 }
 
 const { TextArea } = Input
-const { Text } = Typography
 
 const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
   visible,
@@ -31,30 +26,29 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
   defaultKeyNumber = 1
 }) => {
   const [form] = Form.useForm()
-  const { token } = theme.useToken()
   const [neverExpire, setNeverExpire] = useState(true)
 
   useEffect(() => {
     if (visible) {
       if (mode === 'add') {
         form.setFieldsValue({
-          keyName: `KEY${defaultKeyNumber}`,
+          id: `KEY${defaultKeyNumber}`,
           neverExpire: true,
-          expirationDate: dayjs().add(7, 'days'),
-          apiKey: {
+          expire_time: dayjs().add(7, 'days'),
+          name: {
             openai_api_base: 'API Base',
             openai_api_key: 'API Key'
           }
         })
       } else if (initialValues) {
         form.setFieldsValue({
-          keyName: initialValues.keyName,
-          apiKey: initialValues.apiKey,
-          expirationDate: initialValues.expirationDate ? dayjs(initialValues.expirationDate) : undefined,
+          id: initialValues.id,
+          name: initialValues.name,
+          expire_time: initialValues.expire_time ? dayjs(initialValues.expire_time) : undefined,
           enabled: initialValues.enabled,
-          neverExpire: !initialValues.expirationDate
+          neverExpire: !initialValues.expire_time
         })
-        setNeverExpire(!initialValues.expirationDate)
+        setNeverExpire(!initialValues.expire_time)
       }
     }
   }, [visible, mode, initialValues, defaultKeyNumber, form])
@@ -64,7 +58,7 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
       const values = await form.validateFields()
       onSave({
         ...values,
-        expirationDate: neverExpire ? null : values.expirationDate.format('YYYY-MM-DD HH:mm:ss')
+        expire_time: neverExpire ? null : values.expire_time.format('YYYY-MM-DD HH:mm:ss')
       })
     } catch (error) {
       console.error('Validation failed:', error)
@@ -75,14 +69,14 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
     setNeverExpire(checked)
     if (!checked) {
       form.setFieldsValue({
-        expirationDate: dayjs().add(7, 'days')
+        expire_time: dayjs().add(7, 'days')
       })
     }
   }
 
   return (
     <Modal
-      title={mode === 'add' ? $t('Add {{vendorName}} APIKEY', { vendorName }) : $t('Edit API Key')}
+      title={mode === 'add' ? $t('Add {{vendorName}} name', { vendorName }) : $t('Edit API Key')}
       open={visible}
       onCancel={onCancel}
       onOk={handleOk}
@@ -91,7 +85,7 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
     >
       <Form form={form} layout="vertical">
         <Form.Item
-          name="keyName"
+          name="id"
           label={$t('* KEY Name')}
           rules={[{ required: true, message: $t('Please input the KEY name') }]}
         >
@@ -99,7 +93,7 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
         </Form.Item>
 
         <Form.Item
-          name="apiKey"
+          name="name"
           label={
             <div style={{ display: 'flex', justifyContent: 'space-between', width: '100%' }}>
               <span>{$t('* API KEY')}</span>
@@ -139,7 +133,7 @@ const ApiKeyModal: React.FC<ApiKeyModalProps> = ({
 
         {!neverExpire && (
           <Form.Item
-            name="expirationDate"
+            name="expire_time"
             label={$t('Expiration Date')}
             rules={[{ required: true, message: $t('Please select expiration date') }]}
           >

frontend/packages/core/src/pages/keySettings/index.tsx

@@ -1,4 +1,4 @@
-import { ActionType, ProColumns } from '@ant-design/pro-components'
+import { ActionType } from '@ant-design/pro-components'
 import InsidePage from '@common/components/aoplatform/InsidePage'
 import PageList, { PageProColumns } from '@common/components/aoplatform/PageList'
 import TableBtnWithPermission from '@common/components/aoplatform/TableBtnWithPermission'
@@ -8,23 +8,21 @@ import { $t } from '@common/locales'
 import { Divider, message, Select, Space, Typography } from 'antd'
 import React, { useEffect, useRef, useState } from 'react'
 import ApiKeyModal from './components/ApiKeyModal'
-import StatusFilter from './components/StatusFilter'
 
-interface APIKey {
+export interface APIKey {
   id: string
   name: string
   status: 'normal' | 'exceeded' | 'expired' | 'disabled' | 'error'
   use_token: number
   update_time: string
   expire_time: string
-  can_delete: string
+  can_delete: boolean
   priority: number
 }
 
 const KeySettings: React.FC = () => {
   const actionRef = useRef<ActionType>()
   const [selectedProvider, setSelectedProvider] = useState<string>('openai')
-  const [statusFilter, setStatusFilter] = useState<string[]>([])
   const [modalVisible, setModalVisible] = useState(false)
   const [modalMode, setModalMode] = useState<'add' | 'edit'>('add')
   const [editingKey, setEditingKey] = useState<APIKey | null>(null)
@@ -63,12 +61,12 @@ const KeySettings: React.FC = () => {
 
   const handleSave = (values: any) => {
     if (modalMode === 'edit' && editingKey) {
-      const newKeys = apiKeys.map((key) =>
+      const newKeys: APIKey[] = apiKeys.map((key) =>
         key.id === editingKey.id
           ? {
               ...key,
-              key: values.apiKey,
-              expirationDate: values.expirationDate,
+              key: values.name,
+              expire_time: values.expire_time,
               status: values.enabled ? 'normal' : 'disabled'
             }
           : key
@@ -76,13 +74,15 @@ const KeySettings: React.FC = () => {
       setApiKeys(newKeys)
     } else {
       // Handle add case
-      const newKey = {
+      const newKey: APIKey = {
         id: String(Date.now()),
-        key: values.apiKey,
+        name: values.name,
         status: 'normal',
-        expirationDate: values.expirationDate,
+        expire_time: values.expire_time,
         priority: apiKeys.length + 1,
-        isDefault: apiKeys.length === 0
+        can_delete: true,
+        use_token: 0,
+        update_time: ''
       }
       setApiKeys([...apiKeys, newKey])
     }
@@ -134,19 +134,11 @@ const KeySettings: React.FC = () => {
           onClick={() => handleDelete(entity.id)}
           btnTitle={$t('删除')}
         />
-        // <Tooltip title={$t('编辑')}>
-        //   <Button type="text" icon={<EditOutlined />} onClick={() => handleEdit(entity)} />
-        // </Tooltip>,
-        // entity.can_delete && (
-        //   <Tooltip title={$t('删除')}>
-        //     <Button type="text" icon={<DeleteOutlined />} danger onClick={() => handleDelete(entity.id)} />
-        //   </Tooltip>
-        // )
       ]
     }
   ]
 
-  const columns: ProColumns<APIKey>[] = [
+  const columns: PageProColumns<APIKey>[] = [
     {
       title: $t('调用优先级'),
       dataIndex: 'priority',
@@ -184,28 +176,27 @@ const KeySettings: React.FC = () => {
     ...operation
   ]
 
-  const beforeSearchNode = [
-    <Select
-      key="provider"
-      value={selectedProvider}
-      onChange={setSelectedProvider}
-      style={{ width: 200 }}
-      options={[
-        { label: 'OpenAI', value: 'openai' },
-        { label: 'Anthropic', value: 'anthropic' }
-      ]}
-    />,
-    <StatusFilter key="status" value={statusFilter} onChange={setStatusFilter} />
-  ]
-
   return (
     <InsidePage
       className="overflow-y-auto pb-PAGE_INSIDE_B pr-PAGE_INSIDE_X"
       pageTitle={$t('APIKey 资源池')}
-      description={$t('支持单个 API 模型供应商下创建多个 APIKey，并可对多个 APIkey 进行智能负载均衡')}
+      description={$t('支持单个 API 模型供应商下创建多个 APIKey APIKey 进行智能负载均衡')}
       showBorder={false}
       scrollPage={false}
     >
+      <Space className="flex items-center">
+        <span>{$t('选择AI模型供应商')}:</span>
+        <Select
+          key="provider"
+          value={selectedProvider}
+          onChange={setSelectedProvider}
+          style={{ width: 200 }}
+          options={[
+            { label: 'OpenAI', value: 'openai' },
+            { label: 'Anthropic', value: 'anthropic' }
+          ]}
+        />
+      </Space>
       <PageList
         actionRef={actionRef}
         rowKey="id"
@@ -215,7 +206,6 @@ const KeySettings: React.FC = () => {
               method: 'GET',
               eoParams: {
                 provider: selectedProvider,
-                status: statusFilter,
                 ...params
               },
               eoApiPrefix: 'http://uat.apikit.com:11204/mockApi/aoplatform/api/v1/'
@@ -244,14 +234,11 @@ const KeySettings: React.FC = () => {
           }
         }}
         columns={columns}
-        search={false}
         dragSortKey="sort"
-        onDragSortEnd={handleDragSortEnd}
-        beforeSearchNode={beforeSearchNode}
+        // onDragSortEnd={handleDragSortEnd}
         addNewBtnTitle={$t('添加 APIKey')}
         onAddNewBtnClick={handleAdd}
       />
-
       <ApiKeyModal
         visible={modalVisible}
         mode={modalMode}
@@ -261,10 +248,9 @@ const KeySettings: React.FC = () => {
         initialValues={
           editingKey
             ? {
-                keyName: editingKey.key,
-                apiKey: editingKey.key,
-                expirationDate: editingKey.expirationDate,
-                enabled: editingKey.status === 'normal'
+                id: editingKey.id,
+                name: editingKey.name,
+                expire_time: editingKey.expire_time
               }
             : undefined
         }