chore: add worker command paramters

src/pages/llmodels/components/search-model.tsx

@@ -1,8 +1,4 @@
-import {
-  BulbOutlined,
-  QuestionCircleOutlined,
-  WarningOutlined
-} from '@ant-design/icons';
+import { BulbOutlined, QuestionCircleOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
 import { Checkbox, Select, Tooltip } from 'antd';
 import _ from 'lodash';
@@ -238,7 +234,9 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
           modelSource={modelSource}
         ></SearchInput>
         <div className="gguf-tips">
-          <WarningOutlined className="font-size-14 m-r-5 warning" />
+          <span className="m-r-5">
+            {intl.formatMessage({ id: 'common.tips.title' })}
+          </span>
           <span>
             {intl.formatMessage({ id: 'models.form.search.gguftips' })}
           </span>

src/pages/resources/components/add-worker.tsx

@@ -41,7 +41,7 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
       width={600}
       styles={{
         body: {
-          height: 310
+          height: 410
         }
       }}
       footer={null}

src/pages/resources/components/container-install.tsx

@@ -3,7 +3,7 @@ import { getAtomStorage } from '@/atoms/utils';
 import HighlightCode from '@/components/highlight-code';
 import { BulbOutlined, WarningOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Radio } from 'antd';
+import { Button, Radio } from 'antd';
 import React from 'react';
 import { addWorkerGuide, containerInstallOptions } from '../config';
 import './styles/installation.less';
@@ -24,14 +24,17 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
     if (!version || !versionInfo.isProduction) {
       version = 'main';
     }
+
+    const commandCode = addWorkerGuide[activeKey];
+
     if (activeKey === 'cuda') {
-      return addWorkerGuide.docker.registerWorker({
+      return commandCode?.registerWorker({
         server: origin,
         tag: version,
         token: props.token
       });
     }
-    return addWorkerGuide.docker.registerWorker({
+    return commandCode?.registerWorker({
       server: origin,
       tag: `${version}-${activeKey}`,
       token: props.token
@@ -40,9 +43,8 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
 
   return (
     <div className="container-install">
-      <div className="notes">
-        <span>
-          1.{' '}
+      <ul className="notes">
+        <li>
           <span>
             {intl.formatMessage({ id: 'resources.worker.container.supported' })}
           </span>
@@ -50,18 +52,32 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
             style={{ color: 'var(--ant-color-warning)' }}
             className="font-size-14 m-l-5"
           />
-        </span>
-        <span>
-          2.{' '}
+        </li>
+        <li>
           {intl.formatMessage(
             { id: 'resources.worker.current.version' },
             { version: versionInfo.version }
           )}
-        </span>
-        <span>
-          3. {intl.formatMessage({ id: 'resources.worker.select.command' })}
-        </span>
-      </div>
+        </li>
+        <li>{intl.formatMessage({ id: 'resources.worker.select.command' })}</li>
+        <li>
+          <span>
+            {intl.formatMessage({ id: 'resources.worker.driver.install' })}
+          </span>
+          <WarningOutlined
+            style={{ color: 'var(--ant-color-warning)' }}
+            className="font-size-14 m-l-5"
+          />
+          <Button
+            type="link"
+            size="small"
+            href="https://docs.gpustack.ai/latest/installation/installation-requirements/"
+            target="_blank"
+          >
+            {intl.formatMessage({ id: 'playground.audio.enablemic.doc' })}
+          </Button>
+        </li>
+      </ul>
       <div className="m-b-20">
         <Radio.Group
           block
@@ -74,6 +90,14 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
           size="small"
         />
       </div>
+      {activeKey === 'npu' && (
+        <div
+          className="m-b-8 text-tertiary"
+          dangerouslySetInnerHTML={{
+            __html: intl.formatMessage({ id: 'resources.worker.cann.tips' })
+          }}
+        ></div>
+      )}
       <HighlightCode theme="dark" code={code}></HighlightCode>
       <h3>
         <BulbOutlined className="m-r-5"></BulbOutlined>

src/pages/resources/components/script-install.tsx

@@ -12,7 +12,7 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
   const origin = window.location.origin;
 
   return (
-    <div>
+    <div className="script-install">
       <h4>{intl.formatMessage({ id: 'resources.worker.linuxormaxos' })}</h4>
       <HighlightCode
         code={addWorkerGuide.mac.registerWorker({

src/pages/resources/components/styles/installation.less

@@ -9,5 +9,20 @@
     padding-left: 16px;
     background: var(--color-fill-sider);
     border-radius: 2px;
+    list-style-type: decimal;
+
+    li {
+      margin-left: 12px;
+    }
+  }
+
+  .code-pre {
+    white-space: pre-wrap;
+  }
+}
+
+.script-install {
+  .code-pre {
+    white-space: pre-wrap;
   }
 }

src/pages/resources/config/index.ts

@@ -15,7 +15,7 @@ export const status: any = {
   [WorkerStatusMap.not_ready]: StatusMaps.error
 };
 
-export const addWorkerGuide = {
+export const addWorkerGuide: Record<string, any> = {
   mac: {
     getToken: 'cat /var/lib/gpustack/token',
     registerWorker(params: { server: string; token: string }) {
@@ -29,12 +29,33 @@ export const addWorkerGuide = {
       return `Invoke-Expression "& { $((Invoke-WebRequest -Uri "https://get.gpustack.ai" -UseBasicParsing).Content) } --server-url ${params.server} --token ${params.token}"`;
     }
   },
-  docker: {
+  cuda: {
     getToken:
       'Get-Content -Path (Join-Path -Path $env:APPDATA -ChildPath "gpustack\\token") -Raw',
     registerWorker(params: { server: string; tag: string; token: string }) {
       return `docker run -d --gpus all --ipc=host --network=host gpustack/gpustack:${params.tag} --server-url ${params.server} --token ${params.token}`;
     }
+  },
+  npu: {
+    getToken:
+      'Get-Content -Path (Join-Path -Path $env:APPDATA -ChildPath "gpustack\\token") -Raw',
+    registerWorker(params: { server: string; tag: string; token: string }) {
+      return `docker run -d --ipc=host -e ASCEND_VISIBLE_DEVICES=0 --network=host gpustack/gpustack:${params.tag} --server-url ${params.server} --token ${params.token}`;
+    }
+  },
+  musa: {
+    getToken:
+      'Get-Content -Path (Join-Path -Path $env:APPDATA -ChildPath "gpustack\\token") -Raw',
+    registerWorker(params: { server: string; tag: string; token: string }) {
+      return `docker run -d --ipc=host --network=host gpustack/gpustack:${params.tag} --server-url ${params.server} --token ${params.token}`;
+    }
+  },
+  cpu: {
+    getToken:
+      'Get-Content -Path (Join-Path -Path $env:APPDATA -ChildPath "gpustack\\token") -Raw',
+    registerWorker(params: { server: string; tag: string; token: string }) {
+      return `docker run -d --ipc=host --network=host gpustack/gpustack:${params.tag} --server-url ${params.server} --token ${params.token}`;
+    }
   }
 };