quickcommand.askAI支持流式响应，支持使用默认api配置

2025-10-09 23:13:22 +08:00 · 2025-02-21 11:31:45 +08:00
parent 0090442101
commit 1e5a4c1ff5
7 changed files with 143 additions and 265 deletions
--- a/src/components/ai/AIAssistantSideBar.vue
+++ b/src/components/ai/AIAssistantSideBar.vue
@@ -91,7 +91,9 @@
          :icon="streamingResponse ? 'stop' : 'send'"
          @click="handleSubmit"
        >
-          <q-tooltip> Enter 发送，Shift+Enter 换行 </q-tooltip>
+          <q-tooltip v-if="!streamingResponse">
+            Enter 发送，Shift+Enter 换行
+          </q-tooltip>
        </q-btn>
      </div>
    </div>
@@ -183,8 +185,7 @@ export default defineComponent({
          },
          this.selectedApi,
          {
-            showLoadingBar: false,
-            stream: true,
+            showProcessBar: false,
            onStream: (text, controller, done) => {
              this.currentRequest = controller;
              if (text) {
@@ -251,7 +252,8 @@ export default defineComponent({
      const languageMap = {
        quickcommand: "NodeJS",
        javascript: "NodeJS",
-        cmd: "bat",
+        cmd: "windows 批处理脚本",
+        shell: "liunx shell脚本",
      };
      const commonInstructions = `请根据我的需求编写${languageMap[language]}代码，并请遵循以下原则：
   - 编写简洁、可读性强的代码
@@ -275,7 +277,7 @@ export default defineComponent({
        languageSpecific[language.toLowerCase()] || "";

      const lastInstructions =
-        "\n请直接给我代码，任何情况下都不需要做解释和说明";
+        "\n请直接给我MARKDOWN格式的代码，任何情况下都不需要做解释和说明";

      return commonInstructions + specificInstructions + lastInstructions;
    },
@@ -306,13 +308,13 @@ export default defineComponent({
        },
      ];

-      if (this.submitDocs) {
+      if (this.submitDocs && this.language === "quickcommand") {
        const docs = this.getLanguageDocs(this.language);

        presetContext.push(
          {
            role: "user",
-            content: `你现在使用的是一种特殊的环境，支持uTools和quickcommand两种特殊的接口，请优先使用uTools和quickcommand接口解决需求`,
+            content: `你现在使用的是一种特殊的环境，支持uTools和quickcommand两种特殊的接口，请优先使用uTools和quickcommand接口解决需求，然后再使用当前语言通用的解决方案`,
          },
          {
            role: "assistant",
--- a/src/js/composer/commands/uiCommands.js
+++ b/src/js/composer/commands/uiCommands.js
@@ -446,8 +446,9 @@ export const uiCommands = {
              width: 4,
            },
            value: {
-              label: "初始进度值",
+              label: "初始进度值(0-100)",
              component: "VariableInput",
+              placeholder: "留空则显示加载动画",
              disableToggleType: true,
              width: 4,
            },
@@ -486,7 +487,7 @@ export const uiCommands = {
          defaultValue: {
            title: newVarInputVal("str", "进度"),
            text: newVarInputVal("str", "处理中..."),
-            value: newVarInputVal("var", "0"),
+            value: newVarInputVal("var"),
            position: "bottom-right",
            onClose: newVarInputVal("var"),
            onPause: newVarInputVal("var"),
@@ -504,8 +505,9 @@ export const uiCommands = {
          component: "OptionEditor",
          options: {
            value: {
-              label: "进度值",
+              label: "进度值(0-100)",
              component: "VariableInput",
+              placeholder: "留空则显示加载动画",
              width: 4,
              disableToggleType: true,
            },
@@ -522,7 +524,7 @@ export const uiCommands = {
            },
          },
          defaultValue: {
-            value: newVarInputVal("var", "0"),
+            value: newVarInputVal("var", "100"),
            text: newVarInputVal("str"),
            complete: false,
          },
@@ -537,65 +539,6 @@ export const uiCommands = {
        },
      ],
    },
-    {
-      value: "quickcommand.showLoadingBar",
-      label: "显示载入界面",
-      neverHasOutput: true,
-      asyncMode: "await",
-      config: [
-        {
-          component: "OptionEditor",
-          options: {
-            text: {
-              label: "文本",
-              component: "VariableInput",
-              width: 4,
-            },
-            position: {
-              label: "位置",
-              component: "QSelect",
-              width: 4,
-              options: [
-                { label: "屏幕左上角", value: "top-left" },
-                { label: "屏幕右上角", value: "top-right" },
-                { label: "屏幕左下角", value: "bottom-left" },
-                { label: "屏幕右下角", value: "bottom-right" },
-              ],
-            },
-            onClose: {
-              label: "关闭按钮回调函数",
-              component: "VariableInput",
-              disableToggleType: true,
-              width: 4,
-            },
-          },
-          defaultValue: {
-            text: newVarInputVal("str", "加载中..."),
-            position: "bottom-right",
-            onClose: newVarInputVal("var"),
-          },
-        },
-      ],
-      outputs: {
-        label: "载入条对象",
-        suggestName: "loadingBar",
-      },
-    },
-    {
-      value: "quickcommand.closeLoadingBar",
-      label: "关闭载入界面",
-      neverHasOutput: true,
-      config: [
-        {
-          label: "载入条对象",
-          component: "VariableInput",
-          placeholder: "不传则关闭最近的载入条",
-          width: 12,
-          defaultValue: newVarInputVal("var"),
-          disableToggleType: true,
-        },
-      ],
-    },
    {
      value: "utools.showOpenDialog",
      label: "文件选择框",
--- a/src/plugins/monaco/types/quickcommand.api.d.ts
+++ b/src/plugins/monaco/types/quickcommand.api.d.ts
@@ -750,7 +750,7 @@ interface quickcommandApi {
   * 显示一个带有暂停、恢复、关闭回调功能的进度条，支持动态更新进度
   * @param {object} options - 配置选项
   * @param {string} [options.text="处理中..."] - 进度条上方的文本
-   * @param {number} [options.value=0] - 初始进度值(0-100)
+   * @param {number} [options.value] - 初始进度值(0-100)，不传则显示加载动画
   * @param {string} [options.position="bottom-right"] - 进度条位置，可选值：top-left, top-right, bottom-left, bottom-right
   * @param {Function} [options.onClose] - 关闭按钮点击时的回调函数
   * @param {Function} [options.onPause] - 暂停按钮点击时的回调函数，必须和onResume一起配置
@@ -758,13 +758,19 @@ interface quickcommandApi {
   * @returns {Promise<{id: number, close: Function}>} 返回进度条对象
   *
   * ```js
-   * // 基本使用
+   * // 显示进度条
   * const processBar = await quickcommand.showProcessBar({
   *   text: "正在下载文件...",
   *   value: 0,
   *   position: "bottom-right"
   * });
   *
+   * // 显示加载动画
+   * const processBar = await quickcommand.showProcessBar({
+   *   text: "正在加载...",
+   *   position: "bottom-right"
+   * });
+   *
   * // 带暂停/恢复，关闭回调功能
   * let isPaused = false;
   * const processBar = await quickcommand.showProcessBar({
@@ -824,18 +830,23 @@ interface quickcommandApi {
  /**
   * 更新进度条的进度
   * @param {object} options - 配置选项
-   * @param {number} options.value - 新的进度值(0-100)
+   * @param {number} [options.value] - 新的进度值(0-100)，不传则显示加载动画
   * @param {string} [options.text] - 新的进度文本
   * @param {boolean} [options.complete] - 是否完成并关闭进度条
   * @param {{id: number, close: Function}|undefined} processBar - 进度条对象，如果不传入则使用上一次创建的进度条
   *
   * ```js
-   * // 使用最近创建的进度条
+   * // 更新进度
   * quickcommand.updateProcessBar({
   *   value: 50,
   *   text: "已完成50%"
   * });
   *
+   * // 切换为加载动画
+   * quickcommand.updateProcessBar({
+   *   text: "正在加载..."
+   * });
+   *
   * // 使用指定的进度条
   * quickcommand.updateProcessBar({
   *   value: 50,
@@ -852,7 +863,7 @@ interface quickcommandApi {
   */
  updateProcessBar(
    options: {
-      value: number;
+      value?: number;
      text?: string;
      complete?: boolean;
    },
@@ -862,71 +873,29 @@ interface quickcommandApi {
    }
  ): void;

-  /**
-   * 显示一个循环动画的加载条
-   * @param {object} options - 配置选项
-   * @param {string} [options.text="加载中..."] - 加载条上方的文本
-   * @param {string} [options.position="bottom-right"] - 加载条位置，可选值：top-left, top-right, bottom-left, bottom-right
-   * @param {Function} [options.onClose] - 关闭按钮点击时的回调函数
-   * @returns {Promise<{id: number, close: Function}>} 返回加载条对象
-   *
-   * ```js
-   * // 基本使用
-   * const loadingBar = await quickcommand.showLoadingBar({
-   *   text: "正在加载...",
-   *   position: "bottom-right"
-   * });
-   *
-   * // 带关闭回调
-   * const loadingBar = await quickcommand.showLoadingBar({
-   *   text: "正在加载...",
-   *   onClose: () => {
-   *     console.log("用户关闭了加载条");
-   *   }
-   * });
-   *
-   * // 手动关闭
-   * loadingBar.close();
-   * // 或者
-   * quickcommand.closeLoadingBar();
-   * ```
-   */
-  showLoadingBar(options?: {
-    text?: string;
-    position?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
-    onClose?: () => void;
-  }): Promise<{
-    id: number;
-    close: () => void;
-  }>;
-
-  /**
-   * 关闭加载条
-   * @param {{id: number, close: Function}|undefined} loadingBar - 加载条对象，如果不传入则关闭上一次创建的加载条
-   *
-   * ```js
-   * // 关闭最近创建的加载条
-   * quickcommand.closeLoadingBar();
-   *
-   * // 关闭指定的加载条
-   * quickcommand.closeLoadingBar(loadingBar);
-   * ```
-   */
-  closeLoadingBar(loadingBar?: { id: number; close: () => void }): void;
-
  /**
   * 与 AI 进行问答
   * @param content 对话内容
   * @param content.prompt 提示词
   * @param content.role 预设角色
-   * @param apiConfig API配置
+   * @param apiConfig API配置，不传或传入null则使用用户配置的第一个API配置
   * @param apiConfig.apiType 模型类型：openai/ollama
   * @param apiConfig.apiUrl API地址
   * @param apiConfig.apiToken API令牌（仅 OpenAI 需要）
   * @param apiConfig.model 模型名称
   * @param options 其他选项
-   * @param options.showLoadingBar 是否显示加载条
-   * @example
+   * @param options.showProcessBar 是否显示进度条
+   * @param options.onStream 流式请求回调
+   *
+   *
+   * ```js
+   * // 不传apiConfig时，需在配置页面-右下角菜单-AI配置中进行配置
+   * const response = await quickcommand.askAI(
+   *   {
+   *     prompt: "你好",
+   *   }
+   * );
+   *
   * // OpenAI 示例
   * const response = await quickcommand.askAI(
   *   {
@@ -939,9 +908,10 @@ interface quickcommandApi {
   *     model: "gpt-3.5-turbo"
   *   }
   * );
+   * console.log(response);
   *
-   * // Ollama 示例
-   * const response = await quickcommand.askAI(
+   * // Ollama 示例 (流式回调)
+   * await quickcommand.askAI(
   *   {
   *     prompt: "查找进程名为chrome的进程并关闭",
   *     role: "shell"
@@ -950,8 +920,20 @@ interface quickcommandApi {
   *     apiType: "ollama",
   *     apiUrl: "http://localhost:11434",
   *     model: "qwen2.5:32b"
+   *   },
+   *   {
+   *     onStream: (chunk, controller, isDone) => {
+   *       console.log(chunk);
+   *       if (某个特定条件，中断请求) {
+   *         controller.abort();
+   *       }
+   *       if (isDone) {
+   *         console.log("流式请求完成");
+   *       }
+   *     }
   *   }
   * );
+   * ```
   */
  askAI(
    content: {
@@ -960,7 +942,8 @@ interface quickcommandApi {
      /** 预设角色 */
      role?: "translate" | "shell" | "summarize";
    },
-    apiConfig: {
+    /** API配置，不传或传入null则使用用户配置的第一个API配置 */
+    apiConfig?: {
      /** 模型类型：openai/ollama */
      apiType: "openai" | "ollama";
      /** API地址 */
@@ -971,8 +954,14 @@ interface quickcommandApi {
      model: string;
    },
    options?: {
-      /** 是否显示加载条, 默认 true */
-      showLoadingBar?: boolean;
+      /** 是否显示进度条, 默认 true */
+      showProcessBar?: boolean;
+      /** 流式请求回调 */
+      onStream?: (
+        chunk: string,
+        controller: AbortController,
+        isDone: boolean
+      ) => void;
    }
  ): Promise<{
    /** 是否成功 */