@blueking/ai-ui-sdk 0.0.14 → 0.0.15-beta.10

package/dist/hooks/use-http.js

@@ -0,0 +1,48 @@
+import fetch from '../http/fetch/index.js';
+import { transferSession2SessionApi, transferSessionApi2Session, transferSessionContent2SessionContentApi, transferSessionContentApi2SessionContent } from '../http/helper/session.js';
+export const useHttp = (apiPrefix)=>{
+    // 清除聊天上下文
+    const clearSession = (sessionCode)=>fetch.post(`${apiPrefix}/chat_completion/${sessionCode}/clear/`);
+    // 获取会话列表
+    const getSessions = ()=>fetch.get(`${apiPrefix}/session/`).then((res)=>res.map(transferSessionApi2Session));
+    // 新增会话
+    const plusSession = (data)=>fetch.post(`${apiPrefix}/session/`, transferSession2SessionApi(data)).then((res)=>transferSessionApi2Session(res));
+    // 修改会话
+    const modifySession = (data)=>fetch.put(`${apiPrefix}/session/${data.sessionCode}/`, transferSession2SessionApi(data)).then((res)=>transferSessionApi2Session(res));
+    // 删除会话
+    const deleteSession = (sessionCode)=>fetch.delete(`${apiPrefix}/session/${sessionCode}/`);
+    // 批量删除会话
+    const batchDeleteSessions = (sessionCodes)=>fetch.post(`${apiPrefix}/session/batch_delete/`, {
+            session_codes: sessionCodes
+        });
+    // 获取会话资源
+    const getSession = (sessionCode)=>fetch.get(`${apiPrefix}/session/${sessionCode}/`).then((res)=>transferSessionApi2Session(res));
+    // 获取会话内容列表
+    const getSessionContents = (sessionCode)=>fetch.get(`${apiPrefix}/session_content/content/`, {
+            session_code: sessionCode
+        }).then((res)=>res.map(transferSessionContentApi2SessionContent));
+    // 新增会话内容
+    const plusSessionContent = (data)=>fetch.post(`${apiPrefix}/session_content/`, transferSessionContent2SessionContentApi(data));
+    // 修改会话内容
+    const modifySessionContent = (data)=>fetch.put(`${apiPrefix}/session_content/${data.id}/`, transferSessionContent2SessionContentApi(data));
+    // 删除会话内容
+    const deleteSessionContent = (id)=>fetch.delete(`${apiPrefix}/session_content/${id}/`);
+    // 批量删除聊天内容
+    const batchDeleteSessionContents = (ids)=>fetch.post(`${apiPrefix}/session_content/batch_delete/`, {
+            ids
+        });
+    return {
+        clearSession,
+        getSessions,
+        plusSession,
+        modifySession,
+        deleteSession,
+        batchDeleteSessions,
+        getSession,
+        getSessionContents,
+        plusSessionContent,
+        modifySessionContent,
+        deleteSessionContent,
+        batchDeleteSessionContents
+    };
+};

package/dist/hooks/use-mouse-drag.d.ts

@@ -0,0 +1,13 @@
+export type PositionInfo = {
+    moveDistance: {
+        x: number;
+        y: number;
+    };
+    singleMoveDistance: {
+        x: number;
+        y: number;
+    };
+};
+export declare const useMouseDrag: (targetsClassName: string[], callBack: (positionInfo: PositionInfo) => void) => {
+    isDragging: import("vue").Ref<boolean, boolean>;
+};

package/dist/hooks/use-mouse-drag.js

@@ -0,0 +1,59 @@
+import { onBeforeUnmount, onMounted, ref } from 'vue';
+export const useMouseDrag = (targetsClassName, callBack)=>{
+    const isDragging = ref(false);
+    const startPosition = {
+        x: 0,
+        y: 0
+    };
+    const lastPosition = {
+        x: 0,
+        y: 0
+    };
+    const handleMouseDown = (event)=>{
+        const ele = event.target;
+        if (targetsClassName.some((name)=>{
+            var _ele_className_includes, _ele_className;
+            return (_ele_className = ele.className) === null || _ele_className === void 0 ? void 0 : (_ele_className_includes = _ele_className.includes) === null || _ele_className_includes === void 0 ? void 0 : _ele_className_includes.call(_ele_className, name);
+        })) {
+            isDragging.value = true;
+            startPosition.x = event.x;
+            startPosition.y = event.y;
+            lastPosition.x = event.x;
+            lastPosition.y = event.y;
+        }
+    };
+    const handleMouseMove = (event)=>{
+        if (!isDragging.value) return;
+        event.preventDefault();
+        const positionInfo = {
+            moveDistance: {
+                x: event.x - startPosition.x,
+                y: event.y - startPosition.y
+            },
+            singleMoveDistance: {
+                x: event.x - lastPosition.x,
+                y: event.y - lastPosition.y
+            }
+        };
+        // record lastPosition
+        lastPosition.x = event.x;
+        lastPosition.y = event.y;
+        callBack(positionInfo);
+    };
+    const handleMouseUp = ()=>{
+        isDragging.value = false;
+    };
+    onMounted(()=>{
+        document.addEventListener('mousedown', handleMouseDown);
+        document.addEventListener('mousemove', handleMouseMove);
+        document.addEventListener('mouseup', handleMouseUp);
+    });
+    onBeforeUnmount(()=>{
+        document.removeEventListener('mousedown', handleMouseDown);
+        document.removeEventListener('mousemove', handleMouseMove);
+        document.removeEventListener('mouseup', handleMouseUp);
+    });
+    return {
+        isDragging
+    };
+};

package/dist/hooks/use-reference-doc.d.ts

@@ -1,4 +1,4 @@
-import type { Document } from '../types/type';
+import type { Document } from '../types/session';
 /**
  * 获取引用资料的 HTML 内容
  * @param documents

package/dist/hooks/use-reference-doc.js

@@ -0,0 +1,185 @@
+import { onBeforeMount, onBeforeUnmount } from 'vue';
+/**
+ * 获取引用资料的 HTML 内容
+ * @param documents
+ * @returns
+ */ export const getHtmlContentFromDocuments = (documents)=>{
+    let htmlContent = `<section class="knowledge-head click-close"><svg class="ai-ui-sdk-wenzhang"><use href="#ai-ui-sdk-wenzhang"></use></svg>找到 ${documents.length} 篇资料参考<i class="ai-ui-sdk-icon ai-ui-sdk-angle-up"></i></section><ul class="knowledge-body">`;
+    documents.forEach((document1)=>{
+        const { path, file_path: filePath, display_name: displayName, preview_path: previewPath } = document1.metadata;
+        const title = displayName || filePath.split('/').pop();
+        htmlContent += `<li
+      class="knowledge-item"
+    >
+      <i class="ai-ui-sdk-icon ai-ui-sdk-zhishiku"></i>
+      <a href="${previewPath}" title="${title} (${previewPath})" target="_blank" class="knowledge-link g-flex-truncate">
+        ${title}
+      </a>
+      <a href="${path}" title="预览原文" target="_blank" class="knowledge-link hover-show">
+        <i class="ai-ui-sdk-icon ai-ui-sdk-yanjing-kejian"></i>
+      </a>
+    </li>`;
+    });
+    htmlContent += '</ul>';
+    return htmlContent;
+};
+/**
+ * 移除引用资料的 HTML 内容
+ * @param content
+ * @returns
+ */ export const removeReferenceDoc = (content)=>{
+    return content.replace(/<section class="knowledge-head click-close">[\s\S]*?<\/section>/, '').replace(/<ul class="knowledge-body">[\s\S]*?<\/ul>/, '').replace(/<section class="knowledge-tips">[\s\S]*?<\/section>/, '');
+};
+export const useReferenceDoc = ()=>{
+    let styleEle = null;
+    const addReferenceDocStyle = ()=>{
+        // 旧版知识样式
+        const oldStyle = `.knowledge-tips {
+      position: relative;
+      padding: 6px 8px;
+      margin-bottom: 14px;
+      line-height: 22px;
+      background: #f5f7fa;
+      border-radius: 4px;
+
+      &.closed {
+        .bkaidev-angle-up {
+          transform: rotate(180deg);
+        }
+
+        .knowledge-summary {
+          margin-bottom: 0;
+        }
+
+        .knowledge-link {
+          display: none;
+        }
+      }
+
+      .bkaidev-angle-up {
+        position: absolute;
+        top: 4px;
+        right: 0px;
+        font-size: 22px;
+        color: #979ba5;
+        cursor: pointer;
+      }
+
+      .bkaidev-help-document {
+        margin-right: 4px;
+        font-size: 19px;
+        color: #3a84ff;
+      }
+
+      .knowledge-summary {
+        display: block;
+        margin-bottom: 4px;
+        color: #313238;
+      }
+
+      .knowledge-link {
+        display: block;
+        color: #3a84ff;
+        text-decoration: none;
+        cursor: pointer;
+
+        .bkaidev-cc-jump-link {
+          font-size: 14px;
+        }
+
+        &:last-child {
+          margin-bottom: 2px;
+        }
+      }
+    }`;
+        // 新版知识样式
+        const newStyle = `.knowledge-head {
+      display: flex;
+      align-items: center;
+      padding: 0 8px 0 6px;
+      margin-bottom: 8px;
+      line-height: 28px;
+      background: #F0F1F5;
+      border-radius: 4px;
+      font-size: 12px;
+      color: #313238;
+      cursor: pointer;
+      width: fit-content;
+
+      .ai-ui-sdk-wenzhang {
+        width: 14px;
+        height: 14px;
+        margin-right: 6px;
+      }
+
+      .ai-ui-sdk-angle-up {
+        font-size: 22px;
+        color: #4D4F56;
+        margin-left: 4px;
+      }
+
+      &.closed {
+        margin-bottom: 16px;
+
+        .ai-ui-sdk-angle-up {
+          transform: rotate(180deg);
+        }
+
+        &~ .knowledge-body {
+          display: none;
+        }
+      }
+
+      &:hover {
+        background: #EAEBF0;
+      }
+    }
+    .knowledge-body {
+      background: #F5F7FA;
+      padding: 16px 0 !important;
+      .knowledge-item {
+        padding-left: 10px;
+        display: flex;
+        align-items: center;
+        line-height: 28px;
+        .hover-show {
+          display: none;
+        }
+        a {
+          margin-right: 10px;
+          &:has(i) {
+            padding: 0 10px;
+            margin-right: 0;
+            text-decoration: none !important;
+          }
+        }
+        .ai-ui-sdk-zhishiku {
+          color: #D66F6B;
+          font-size: 14px;
+          margin-right: 6px;
+        }
+        &:hover {
+          background: #EAEBF0;
+          .hover-show {
+            display: inline;
+          }
+        }
+      }
+    }`;
+        styleEle = document.createElement('style');
+        styleEle.textContent = oldStyle + newStyle;
+        document.head.appendChild(styleEle);
+    };
+    const removeReferenceDocStyle = ()=>{
+        if (styleEle) {
+            styleEle.remove();
+            styleEle = null;
+        }
+    };
+    onBeforeMount(()=>{
+        addReferenceDocStyle();
+    });
+    onBeforeUnmount(()=>{
+        removeReferenceDocStyle();
+    });
+};

package/dist/hooks/use-style.js

@@ -0,0 +1,11 @@
+import { useReferenceDoc } from './use-reference-doc.js';
+import { useThink } from './use-think.js';
+import '../css/style.css';
+import '../css/iconcool.js';
+// ai 样式。注意：全局引入一次即可
+export const useStyle = ()=>{
+    // 引用资料
+    useReferenceDoc();
+    // 思考
+    useThink();
+};

package/dist/hooks/use-summary.d.ts

@@ -1,4 +1,4 @@
-import type { SummaryCallbacks } from '../types/type.ts';
+import type { SummaryCallbacks } from '../types/session';
 export declare const useSummary: ({ handleStart, handleEnd, handleError, }?: SummaryCallbacks) => {
     summary: ({ content, url, headers, model, }: {
         content: string;

package/dist/hooks/use-summary.js

@@ -0,0 +1,55 @@
+import { SessionPromptRole } from '../types/enum.js';
+import { removeReferenceDoc } from './use-reference-doc.js';
+import { removeThink } from './use-think.js';
+import { ChatHelper } from '../common/chart-helper.js';
+// ai 总结
+export const useSummary = ({ handleStart, handleEnd, handleError } = {})=>{
+    let summaryText = '';
+    const handleStartChat = ()=>{
+        summaryText = '';
+        return handleStart === null || handleStart === void 0 ? void 0 : handleStart();
+    };
+    const handleTextChat = (sessionCode, message, cover)=>{
+        if (cover || summaryText === '正在思考...') {
+            summaryText = message;
+        } else {
+            summaryText += message;
+        }
+    };
+    const handleEndChat = ()=>{
+        if (summaryText === '无话可说') {
+            summaryText = '';
+        }
+        return handleEnd === null || handleEnd === void 0 ? void 0 : handleEnd(summaryText);
+    };
+    const handleErrorChat = (sessionCode, message, code)=>{
+        return handleError === null || handleError === void 0 ? void 0 : handleError(message, code);
+    };
+    const chatHelper = new ChatHelper({
+        handleStart: handleStartChat,
+        handleText: handleTextChat,
+        handleEnd: handleEndChat,
+        handleError: handleErrorChat
+    });
+    const summary = ({ content, url, headers, model })=>{
+        const filterContent = removeThink(removeReferenceDoc(content));
+        const prompts = [
+            {
+                role: SessionPromptRole.User,
+                content: `你是一个总结大师，请帮助我对下面这段话进行总结。要求总结精炼，不超过 15 个字！且末尾没有标点符号！请注意：如果你无法总结，请回复“无话可说”！\n文字如下：\n${filterContent}`
+            }
+        ];
+        chatHelper.stream({
+            sessionCode: 'summary',
+            url,
+            data: {
+                prompts,
+                model
+            },
+            headers
+        });
+    };
+    return {
+        summary
+    };
+};

package/dist/hooks/use-think.js

@@ -0,0 +1,135 @@
+import { onBeforeMount, onBeforeUnmount } from 'vue';
+import { durationFormatter } from '../common/util.js';
+/**
+ * 获取思考的 HTML 内容
+ * @param chatContent 聊天内容
+ * @param content 思考内容
+ * @param elapsedTime 思考时间
+ * @returns 完整的 chatContent
+ */ export const getHtmlContentFromThink = (chatContent, content, cover, elapsedTime)=>{
+    let htmlContent = chatContent === '内容正在生成中...' || cover ? '' : chatContent;
+    // 思考开始
+    if (!htmlContent.includes('<section class="think-head click-close">')) {
+        htmlContent += `<section class="think-head click-close">
+      <i class="ai-ui-sdk-icon ai-ui-sdk-sikao"></i>思考中...<i class="ai-ui-sdk-icon ai-ui-sdk-angle-up"></i>
+    </section>
+    <section class="think-body">
+      ${content}
+</section>`;
+    } else {
+        // 补充思考内容
+        const thinkBodyMatch = htmlContent.match(/<section class="think-body">([\s\S]*?)<\/section>/);
+        if (thinkBodyMatch) {
+            // 原有思考内容
+            const thinkContent = thinkBodyMatch[1];
+            // 在最后的换行符前面添加新的思考内容
+            const newThinkContent = thinkContent.replace(/\n$/g, `${content}\n`);
+            htmlContent = htmlContent.replace(thinkContent, newThinkContent);
+        }
+    }
+    // 思考结束
+    if (elapsedTime) {
+        htmlContent = htmlContent.replace('思考中...', `已完成思考 (耗时：${durationFormatter(elapsedTime)})`);
+    }
+    return htmlContent;
+};
+/**
+ * 移除思考的 HTML 内容
+ * @param content
+ * @returns
+ */ export const removeThink = (content)=>{
+    // 移除思考头部
+    const afterRemoveThinkHead = content.replace(/<section class="think-head click-close">[\s\S]*<\/section>/, '');
+    // 移除思考内容
+    let afterRemoveThinkBody = afterRemoveThinkHead.replace(/<section class="think-body">[\s\S]*<\/section>/, '');
+    // 如果内容只有思考，那就给ai传递思考内容
+    if (afterRemoveThinkBody.trim() === '') {
+        const thinkBodyMatch = content.match(/<section class="think-body">([\s\S]*?)<\/section>/);
+        if (thinkBodyMatch) {
+            [, afterRemoveThinkBody] = thinkBodyMatch;
+        }
+    }
+    return afterRemoveThinkBody;
+};
+/**
+ * 判断是否是思考中
+ * @param content
+ * @returns
+ */ export const isThinking = (content)=>{
+    // 是否开始思考
+    const isStartThinking = content === '正在思考...';
+    // 判断是否空思考
+    const thinkBodyMatch = content.match(/<section class="think-body">([\s\S]*?)<\/section>$/);
+    const isEmptyThinking = thinkBodyMatch && thinkBodyMatch[1].trim() === '';
+    return isStartThinking || isEmptyThinking;
+};
+// 思考
+export const useThink = ()=>{
+    let styleEle = null;
+    const addThinkStyle = ()=>{
+        const style = `.think-head {
+      display: flex;
+      align-items: center;
+      padding: 0 8px 0 6px;
+      margin-bottom: 8px;
+      line-height: 28px;
+      background: #F0F1F5;
+      border-radius: 4px;
+      font-size: 12px;
+      color: #313238;
+      cursor: pointer;
+      width: fit-content;
+      .ai-ui-sdk-sikao {
+        font-size: 14px;
+        color: #979ba5;
+        margin-right: 4px;
+      }
+
+      .ai-ui-sdk-angle-up {
+        font-size: 22px;
+        color: #4D4F56;
+        margin-left: 4px;
+      }
+
+      &.closed {
+        margin-bottom: 16px;
+
+        .ai-ui-sdk-angle-up {
+          transform: rotate(180deg);
+        }
+
+        &~ .think-body {
+          display: none;
+        }
+      }
+
+      &:hover {
+        background: #EAEBF0;
+      }
+    }
+    .think-body {
+      background: #F5F7FA;
+      color: #979BA5;
+      padding: 16px;
+      margin-bottom: 16px;
+      &~ .knowledge-head {
+        margin-bottom: 8px;
+      }
+    }`;
+        styleEle = document.createElement('style');
+        styleEle.textContent = style;
+        document.head.appendChild(styleEle);
+    };
+    const removeThinkStyle = ()=>{
+        if (styleEle) {
+            styleEle.remove();
+            styleEle = null;
+        }
+    };
+    onBeforeMount(()=>{
+        addThinkStyle();
+    });
+    onBeforeUnmount(()=>{
+        removeThinkStyle();
+    });
+};

package/dist/http/fetch/error-interceptor.d.ts

@@ -0,0 +1,3 @@
+import type { IFetchConfig } from './index';
+declare const _default: (error: any, config: IFetchConfig) => Promise<never>;
+export default _default;

package/dist/http/fetch/error-interceptor.js

@@ -0,0 +1,28 @@
+import { emitEvent } from '../../event/index.js';
+import { EventType, HttpErrorCode } from '../../types/enum.js';
+import { Message } from 'bkui-vue';
+// 请求执行失败拦截器
+export default ((error, config)=>{
+    const { code, message, response } = error;
+    // 用户登录状态失效
+    if ([
+        'ret: 1002',
+        'ret: 1001',
+        'user authentication failed'
+    ].some((item)=>{
+        var _response_message;
+        return response === null || response === void 0 ? void 0 : (_response_message = response.message) === null || _response_message === void 0 ? void 0 : _response_message.includes(item);
+    }) || code === HttpErrorCode.UnLogin) {
+        emitEvent(EventType.Unlogin);
+    } else if (code === HttpErrorCode.IamNoPermission && !config.noCheckPermission) {
+        emitEvent(EventType.Unauthorized);
+    } else if (config.globalError && code !== HttpErrorCode.Aborted) {
+        // 全局捕获错误给出提示
+        Message({
+            theme: 'error',
+            message,
+            width: 'auto'
+        });
+    }
+    return Promise.reject(error);
+});

package/dist/http/fetch/index.d.ts

@@ -0,0 +1,25 @@
+export interface IFetchConfig extends RequestInit {
+    requestType?: 'json' | 'formData';
+    responseType?: 'json' | 'text' | 'formData' | 'file' | 'blob';
+    globalError?: Boolean;
+    signal?: AbortSignal;
+    withoutSpace?: boolean;
+    noCheckPermission?: boolean;
+}
+type HttpMethod = <T>(url: string, payload?: any, config?: IFetchConfig) => Promise<T>;
+interface IHttp {
+    get: HttpMethod;
+    post: HttpMethod;
+    put: HttpMethod;
+    delete: HttpMethod;
+    head: HttpMethod;
+    options: HttpMethod;
+    patch: HttpMethod;
+}
+declare const http: IHttp;
+declare const withAbort: <R, T extends any[]>(fn: (signal: AbortSignal, ...args: T) => Promise<R>) => {
+    (...args: T): Promise<R>;
+    abort(): void | undefined;
+};
+export default http;
+export { withAbort };