refactor: 显卡数量选择变成option选项、去除readme中的无用image (#40)

- 显卡数量选择变成option选项
- 去除readme中的无用image
- 新增administrator管理员账号(用于编辑内置应用)
- 改变代码编辑器目录名称避免出现404问题
- 修复组件运行实现为undefined问题
- 解决画布中调用推理服务参数为undefined问题
- 添加互联网功能开关机制
- 调整内置的模型清单
- 更新内置模型清单、解除上传模型不可推理限制、增加模型首次启动标识、增加推理引擎是否正常检测功能
- 自动生成帮助文档导航
- 修改模型来源model_kind和相关功能优化

Co-authored-by: wangbochao.vendor <15830881993@163.com>

Author: wangbochao789

README.md

@@ -1,5 +1,6 @@
 import React from 'react'
-import { Form, Input, Modal } from 'antd'
+import { Form, Input, Modal, Tooltip } from 'antd'
+import { QuestionCircleOutlined } from '@ant-design/icons'
 import { editModel } from '@/infrastructure/api/modelWarehouse'
 import Toast, { ToastTypeEnum } from '@/app/components/base/flash-notice'
 
@@ -55,7 +56,40 @@ const ModalList = (props: any) => {
         {isOpenAI && (
           <Form.Item
             name="proxy_url"
-            label="URL"
+            label={
+              <span>
+                URL{' '}
+                <Tooltip
+                  title={
+                    <div style={{ whiteSpace: 'pre-wrap' }}>
+                      OpenAI协议接入方式（示例URL为：http://ip:8000/v1/）：
+                      <br />
+                      1、接入已有的标准OpenAI协议的推理服务，填写推理服务地址即可
+                      <br />
+                      2、使用vllm-openai镜像方式搭建OpenAI协议的推理服务
+                      <br />
+                      <pre style={{ margin: '8px 0', background: 'rgba(255,255,255,0.1)', padding: '8px', borderRadius: '4px', fontSize: '12px' }}>
+                        {`docker run \\
+  --runtime=nvidia \\
+  -e NVIDIA_VISIBLE_DEVICES=6,7 \\
+  -v /data/nfs/ams/models/Qwen3-32B:/model \\
+  -p 8000:8000 \\
+  --shm-size=32g \\
+  vllm/vllm-openai:v0.11.0 \\
+  --model /model \\
+  --dtype auto \\
+  --tensor-parallel-size 2 \\
+  --served-model-name qwen3-32b \\
+  --port 8000`}
+                      </pre>
+                    </div>
+                  }
+                  overlayStyle={{ maxWidth: '600px' }}
+                >
+                  <QuestionCircleOutlined style={{ cursor: 'pointer' }} />
+                </Tooltip>
+              </span>
+            }
             dependencies={['api_key']}
             rules={[
               // { required: true, message: 'URL 和 API Key 至少需要填写一个' },

back/LazyLLM

@@ -1,7 +1,7 @@
 'use client'
 import React, { useEffect, useRef, useState } from 'react'
-import { Button, Collapse, Empty, Form, Input, InputNumber, Modal, Pagination, Popconfirm, Select, Spin, Tag, message } from 'antd'
-import { MinusCircleOutlined, PlusCircleOutlined } from '@ant-design/icons'
+import { Button, Collapse, Empty, Form, Input, Modal, Pagination, Popconfirm, Select, Spin, Tag, Tooltip, message } from 'antd'
+import { MinusCircleOutlined, PlusCircleOutlined, QuestionCircleOutlined } from '@ant-design/icons'
 import { useUpdateEffect } from 'ahooks'
 import style from './page.module.scss'
 import ChatModal from './chatModal'
@@ -62,6 +62,8 @@ const InferenceService = () => {
   const [sName, setSName] = useState('')
   const [selectLabels, setSelectLabels] = useState([]) as any
   const [creator, setCreator] = useState([]) as any
+  const [riskModalOpen, setRiskModalOpen] = useState(false)
+  const [pendingValues, setPendingValues] = useState<any>(null)
 
   // 添加轮询相关的引用
   const pollingTimer = useRef<NodeJS.Timeout | null>(null)
@@ -188,47 +190,62 @@ const InferenceService = () => {
     setIsModalOpen(true)
   }
 
-  const handleOk = () => {
-    if (isView) {
-      setIsModalOpen(false)
-      setIsView(false)
-      return
-    }
+  const submitFormValues = async (values: any) => {
     let gUrl = ''
     if (isEdit)
       gUrl = '/infer-service/service/create'
 
     else
       gUrl = '/infer-service/group/create'
 
+    setBtnLoading(true)
+
+    try {
+      const res: any = await createPrompt({
+        url: gUrl,
+        body: values,
+      })
+      if (res) {
+        message.success('保存成功')
+        form.resetFields()
+        setModelType('localLLM')
+        getList(1, '')
+        setIsModalOpen(false)
+        setPageOption({ ...pageOption, page: 1 })
+      }
+    }
+    finally {
+      setBtnLoading(false)
+      setPendingValues(null)
+      setRiskModalOpen(false)
+    }
+  }
+
+  const handleOk = () => {
+    if (isView) {
+      setIsModalOpen(false)
+      setIsView(false)
+      return
+    }
     form.validateFields().then(async (values) => {
-      setBtnLoading(true)
-
-      const params = { ...values }
-      try {
-        const res: any = await createPrompt({
-          url: gUrl,
-          body: params,
-        })
-        if (res) {
-          message.success('保存成功')
-          form.resetFields()
-          setModelType('localLLM')
-          getList(1, '')
-          setIsModalOpen(false)
-          setPageOption({ ...pageOption, page: 1 })
+      if (!isEdit) {
+        const selectedModel = modelList.find((item: any) => item.id === values.model_id)
+        if (selectedModel && selectedModel.need_confirm === false) {
+          setPendingValues(values)
+          setRiskModalOpen(true)
+          return
         }
       }
-      finally {
-        setBtnLoading(false)
-      }
+      submitFormValues(values)
     })
   }
 
   const handleCancel = () => {
     setIsModalOpen(false)
     form.resetFields()
     setModelType('localLLM')
+    setPendingValues(null)
+    setRiskModalOpen(false)
   }
 
   const onSearchApp = (e) => {
@@ -527,9 +544,24 @@ const InferenceService = () => {
                                 },
                               },
                             ]}
-                            style={{ width: '80%', marginBottom: 0 }}
+                            style={{ marginBottom: 0 }}
                           >
-                            <InputNumber min={1} precision={0} placeholder="分配显卡数量" style={{ width: '100%' }} />
+                            <div className='flex items-center gap-[8px]'>
+                              <Select placeholder="分配显卡数量" style={{ width: '80%' }} options={[{ label: '1', value: 1 }, { label: '2', value: 2 }, { label: '4', value: 4 }, { label: '8', value: 8 }]} />
+                              <Tooltip
+                                placement="top"
+                                title={
+                                  <div className='text-xs leading-relaxed max-w-[280px]'>
+                                    <p>运行大模型占用的显存主要由以下组成(以Qwen3-32B、精度为FP16为例计算，占用显存约为64+8+2=74G)：</p>
+                                    <p>1）模型权重：32B × 2 = 64 GB，固定不变。</p>
+                                    <p>2）KV缓存：2 × 并发数 × 32K × 64 × 128 × 8 × 2，示例为并发1上下文32K，约8G；并发翻倍显存同步增加。</p>
+                                    <p>3）激活值与开销：推理中间计算与框架额外占用约1-2G。</p>
+                                  </div>
+                                }
+                              >
+                                <QuestionCircleOutlined style={{ color: '#0E5DD8' }} />
+                              </Tooltip>
+                            </div>
                           </Form.Item>
                         </div>
                       </Form.Item>
@@ -540,6 +572,22 @@ const InferenceService = () => {
             </Form>
           </div>
         </Modal>
+        <Modal
+          open={riskModalOpen}
+          title="启动风险提示"
+          okText="坚持启动"
+          cancelText="取消"
+          onOk={() => pendingValues && submitFormValues(pendingValues)}
+          onCancel={() => {
+            setRiskModalOpen(false)
+            setPendingValues(null)
+          }}
+        >
+          <div className='leading-relaxed'>
+            <p>当前模型不在官方支持清单内，启动推理服务时可能无法成功。</p>
+            <p>是否仍然选择继续启动？</p>
+          </div>
+        </Modal>
         <ChatModal agentId={testInfo?.id} modelName={testInfo?.name} visible={visible} onOk={() => setVisible(false)} onCancel={() => setVisible(false)} />
       </div>
     </Spin>

back/src/parts/doc/template/README.md

@@ -11,7 +11,7 @@ type HistoryDataFormat = {
     inputs: string
     outputs: string
     status: string
-    consumed_time: number
+    elapsed_time: number
     prompt_tokens: number
     completion_tokens: number
     sessionid: string
@@ -86,7 +86,7 @@ const convertHistoryDataToNodeMonitoring = (rawData: HistoryDataFormat): History
         process_record: null,
         outputs: item.outputs,
         status: item.status,
-        consumed_time: item.consumed_time,
+        elapsed_time: item.elapsed_time,
         execution_metadata: {
           total_tokens: item.prompt_tokens + item.completion_tokens,
           total_price: 0,

back/src/parts/doc/template/media/media/jh4gvne-9h0ympnwcu_xm.png

@@ -362,7 +362,7 @@ const WorkflowPreview = () => {
                     varOutputs={varOutputs}
                     status={workflowLiveData?.result?.status || ''}
                     error={workflowLiveData?.result?.error as any}
-                    consumed_time={workflowLiveData?.result?.consumed_time}
+                    elapsed_time={workflowLiveData?.result?.elapsed_time}
                     total_tokens={workflowLiveData?.result?.total_tokens}
                     created_at={workflowLiveData?.result?.created_at}
                     created_by={(workflowLiveData?.result?.created_by as any)?.name}

front/app/(appLayout)/inferenceService/cloud/EditModel.tsx

@@ -212,7 +212,7 @@ const WorkflowExecutionPanel: FC<WorkflowExecutionPanelProps> = ({
                 simple_error: executionDetail.error,
               }
               : undefined}
-            consumed_time={executionDetail.consumed_time}
+            elapsed_time={executionDetail.elapsed_time}
             total_tokens={executionDetail.total_tokens}
             created_at={executionDetail.created_at}
             created_by={determineExecutor}

front/app/(appLayout)/inferenceService/platform/page.tsx

@@ -12,7 +12,7 @@ import { fetchTraceList } from '@/infrastructure/api//log'
 import './index.scss'
 
 export type ExecutionResultProps = {
-  consumed_time?: number
+  elapsed_time?: number
   created_at?: number
   created_by?: string
   error?: { detail_error: string; simple_error: string }
@@ -28,7 +28,7 @@ export type ExecutionResultProps = {
 }
 
 const ExecutionResult: FC<ExecutionResultProps> = ({
-  consumed_time,
+  elapsed_time,
   created_at,
   created_by,
   error,
@@ -81,7 +81,7 @@ const ExecutionResult: FC<ExecutionResultProps> = ({
       <div className='px-4 py-2'>
         <ExecutionStatus
           status={status}
-          time={consumed_time}
+          time={elapsed_time}
           tokens={total_tokens}
           error={error}
         />
@@ -149,7 +149,7 @@ const ExecutionResult: FC<ExecutionResultProps> = ({
           status={status}
           executor={created_by}
           startTime={created_at}
-          time={consumed_time}
+          time={elapsed_time}
           tokens={total_tokens}
           steps={steps}
           presentSteps={presentSteps}