feat: add route apikey and ai api

frontend/packages/common/src/const/const.tsx

@@ -26,7 +26,10 @@ export const routerKeyMap = new Map<string, string[] | string>([
   ['operationCenter', ['member', 'user', 'role', 'common']],
   ['organization', ['member', 'user', 'role']],
   ['serviceHubSetting', ['common']],
-  ['maintenanceCenter', ['aisetting', 'datasourcing', 'cluster', 'cert', 'logsettings', 'resourcesettings', 'openapi']]
+  [
+    'maintenanceCenter',
+    ['aisetting', 'keysetting', 'datasourcing', 'cluster', 'cert', 'logsettings', 'resourcesettings', 'openapi']
+  ]
 ])
 
 export const COLUMNS_TITLE = {

frontend/packages/common/src/contexts/GlobalStateContext.tsx

@@ -132,13 +132,34 @@ const mockData = [
             path: '/cluster',
             icon: 'ic:baseline-device-hub',
             access: 'system.settings.api_gateway.view'
-          },
+          }
+        ]
+      },
+      {
+        name: 'AI',
+        key: 'aiSettings',
+        path: '/aisetting',
+        children: [
           {
             name: 'AI 模型',
-            key: 'aisetting',
+            key: 'aiProviders',
             path: '/aisetting',
             icon: 'hugeicons:ai-network',
             access: 'system.settings.ai_provider.view'
+          },
+          {
+            name: 'APIKey 资源池',
+            key: 'aiKeys',
+            path: '/keysetting',
+            icon: 'ic:baseline-key'
+            // access: 'system.settings.ai_key_resource.view'
+          },
+          {
+            name: 'AI API',
+            key: 'aiApiList',
+            path: '/aiapis',
+            icon: 'ic:baseline-api'
+            // access: 'system.settings.ai_api.view'
           }
         ]
       },

frontend/packages/common/src/hooks/pluginLoader.ts

@@ -1,17 +1,17 @@
-import { useEffect, useState } from 'react'
+import { ApiparkPluginDriverType, RouterMapConfig } from '@common/const/type'
+import { PluginConfigType } from '@common/const/type.ts'
 import { useGlobalContext } from '@common/contexts/GlobalStateContext'
+import { usePluginEventHub } from '@common/contexts/PluginEventHubContext'
+import { usePluginSlotHub } from '@common/contexts/PluginSlotHubContext'
+import { useFetch } from '@common/hooks/http'
 import {
   DEFAULT_LOCAL_PLUGIN_PATH,
   generateRemoteModuleTemplate,
   loadRemoteModule,
   validateExportLifecycle
 } from '@common/utils/plugin.tsx'
-import { useFetch } from '@common/hooks/http'
-import { PluginConfigType } from '@common/const/type.ts'
-import { ApiparkPluginDriverType, RouterMapConfig } from '@common/const/type'
-import { usePluginEventHub } from '@common/contexts/PluginEventHubContext'
-import { usePluginSlotHub } from '@common/contexts/PluginSlotHubContext'
 import { App } from 'antd'
+import { useEffect, useState } from 'react'
 
 const mockData = {
   buildAt: '2024-09-13T03:51:25Z',
@@ -80,6 +80,26 @@ const mockData = {
         }
       ]
     },
+    {
+      driver: 'apipark.builtIn.component',
+      name: 'keysetting',
+      router: [
+        {
+          path: 'keysetting',
+          type: 'normal'
+        }
+      ]
+    },
+    {
+      driver: 'apipark.builtIn.component',
+      name: 'aiapis',
+      router: [
+        {
+          path: 'aiapis',
+          type: 'normal'
+        }
+      ]
+    },
     {
       driver: 'apipark.builtIn.component',
       name: 'cert',

frontend/packages/core/src/components/aoplatform/RenderRoutes.tsx

@@ -12,10 +12,7 @@ import React, { createElement, Suspense, useEffect, useState } from 'react'
 import { createBrowserRouter, RouteObject, RouterProvider } from 'react-router-dom'
 
 const RenderRoutes = () => {
-  const { loadPlugins, loadExecutedPlugin } = usePluginLoader(
-    ApiparkPluginDriver(routerMap),
-    routerMap
-  )
+  const { loadPlugins, loadExecutedPlugin } = usePluginLoader(ApiparkPluginDriver(routerMap), routerMap)
   const { routeConfig, dispatch, state } = useGlobalContext()
   const [router, setRouter] = useState<unknown>(null)
 
@@ -54,9 +51,7 @@ const generateRoutes = (routerConfig: RouteConfig[]): RouteObject[] => {
       if (typeof route.lazy === 'function') {
         const result = route.lazy()
         if (result instanceof Promise) {
-          LazyComponent = React.lazy(() =>
-            result.then(module => ({ default: module.default || module }))
-          )
+          LazyComponent = React.lazy(() => result.then((module) => ({ default: module.default || module })))
         } else {
           LazyComponent = result
         }
@@ -77,17 +72,11 @@ const generateRoutes = (routerConfig: RouteConfig[]): RouteObject[] => {
             </div>
           }
         >
-          {route.provider ? (
-            createElement(route.provider, {}, <GuardedComponent />)
-          ) : (
-            <GuardedComponent />
-          )}
+          {route.provider ? createElement(route.provider, {}, <GuardedComponent />) : <GuardedComponent />}
         </Suspense>
       )
     } else {
-      routeElement = route.provider
-        ? createElement(route.provider, {}, route.component)
-        : route.component
+      routeElement = route.provider ? createElement(route.provider, {}, route.component) : route.component
     }
 
     return {

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

@@ -0,0 +1,17 @@
+import InsidePage from '@common/components/aoplatform/InsidePage'
+import { $t } from '@common/locales'
+import React from 'react'
+
+const AIApis: React.FC = () => {
+  return (
+    <InsidePage
+      className="overflow-y-auto pb-PAGE_INSIDE_B"
+      pageTitle={$t('AI API')}
+      description={$t('配置好 AI 模型后，你可以使用对应的大模型来创建 AI 服务')}
+      showBorder={false}
+      scrollPage={false}
+    ></InsidePage>
+  )
+}
+
+export default AIApis

frontend/packages/core/src/pages/aiSetting/AiSettingList.tsx

@@ -77,19 +77,6 @@ const AiSettingList = () => {
       .finally(() => setLoading(false))
   }
 
-  // 第一期暂时隐藏
-  // const updateModalList = ()=>{
-  //     setUpdateLoading(true)
-  //     return fetchData<BasicResponse<{roles:AiSettingListItem[]}>>(`aisetting`,{method:'GET'}).then(response=>{
-  //         const {code,msg} = response
-  //         if(code === STATUS_CODE.SUCCESS){
-  //             getAiSettingList()
-  //         }else{
-  //             message.error(msg || $t(RESPONSE_TIPS.error))
-  //         }
-  //     }).finally(()=>setUpdateLoading(false))
-  // }
-
   const openModal = async (entity: AiSettingListItem) => {
     message.loading($t(RESPONSE_TIPS.loading))
     const { code, data, msg } = await fetchData<BasicResponse<{ provider: AiProviderConfig }>>('ai/provider/config', {
@@ -223,7 +210,7 @@ const AiSettingList = () => {
     <>
       <InsidePage
         className="overflow-y-auto pb-PAGE_INSIDE_B"
-        pageTitle={$t('AI 模型管理')}
+        pageTitle={$t('AI 模型')}
         description={$t('配置好 AI 模型后，你可以使用对应的大模型来创建 AI 服务')}
         showBorder={false}
         scrollPage={false}

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

@@ -0,0 +1,17 @@
+import InsidePage from '@common/components/aoplatform/InsidePage'
+import { $t } from '@common/locales'
+import React from 'react'
+
+const KeySettings: React.FC = () => {
+  return (
+    <InsidePage
+      className="overflow-y-auto pb-PAGE_INSIDE_B"
+      pageTitle={$t('key 模型')}
+      description={$t('配置好 AI 模型后，你可以使用对应的大模型来创建 AI 服务')}
+      showBorder={false}
+      scrollPage={false}
+    ></InsidePage>
+  )
+}
+
+export default KeySettings