paul-ai-assistant 0.1.16

package/es/components/LlmModelChange/index.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import './index.scss';
+/** 第三方模型  工单 */
+export interface IThirdPartyModel {
+    available?: {
+        name: string;
+        code: string;
+    }[];
+    executed?: {
+        name: string;
+        code: string;
+    };
+}
+/** 第三方模型  云企 */
+export interface IModalInfo {
+    currentModalCode?: string;
+    modalDataList?: {
+        name: string;
+        code: string;
+        desc: string;
+    }[];
+}
+/** 生成答案对应问题 */
+export interface IShowQuestion {
+    currentQuestion?: string;
+    originalQuestion?: string;
+    originIsUsed?: boolean;
+}
+/** 点击第三方模型 */
+export type IOnClickThirdPartyModel = (params: {
+    query: string;
+    searchType: string;
+    extInfo: {
+        thirdPartyModel: any;
+        messageId: string;
+    };
+}) => void;
+/** LLM 模型切换 */
+export interface ILlmModelChangeProps {
+    /** 第三方模型  工单 */
+    thirdPartyModel?: IThirdPartyModel;
+    /** 第三方模型  云企 */
+    modalInfo?: IModalInfo;
+    /** 生成答案对应问题 */
+    showQuestion?: IShowQuestion;
+    dialogId?: string;
+    ticketId?: string;
+    /** 点击第三方模型 */
+    onClickThirdPartyModel?: IOnClickThirdPartyModel;
+}
+/**
+ * LLM 模型切换
+ * @param props
+ * @returns
+ */
+declare const LlmModelChange: (props: ILlmModelChangeProps) => React.JSX.Element;
+export default LlmModelChange;

package/es/components/LlmModelChange/index.js

@@ -0,0 +1,138 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useRef, useState } from 'react';
+import { event } from '@alife/goc-utils';
+import { Dropdown } from '@alife/magic-basic';
+import classNames from 'classnames';
+import { ASSIST_CHAT_EVENT } from "../../constants/assistChatEvent";
+import { SEARCH_TYPE } from "../../constants/common";
+import { CSECustomIcon } from "../../utils/CSEIconTool";
+import "./index.scss";
+
+/** 第三方模型  工单 */
+
+/** 第三方模型  云企 */
+
+/** 生成答案对应问题 */
+
+/** 点击第三方模型 */
+
+/** LLM 模型切换 */
+
+/**
+ * LLM 模型切换
+ * @param props
+ * @returns
+ */
+var LlmModelChange = function LlmModelChange(props) {
+  var thirdPartyModel = props.thirdPartyModel,
+    modalInfo = props.modalInfo,
+    showQuestion = props.showQuestion,
+    dialogId = props.dialogId,
+    onClickThirdPartyModel = props.onClickThirdPartyModel;
+  var showThirdPartyModel = function showThirdPartyModel() {
+    var _ref = thirdPartyModel || {},
+      available = _ref.available,
+      executed = _ref.executed;
+    var hasAvailableModels = Array.isArray(available) && (available === null || available === void 0 ? void 0 : available.length) > 0;
+    var hasExecutedModel = executed && (executed === null || executed === void 0 ? void 0 : executed.name);
+    return hasAvailableModels || hasExecutedModel ? /*#__PURE__*/React.createElement("div", {
+      className: "llm-third-party-model-container"
+    }, hasAvailableModels && (available === null || available === void 0 ? void 0 : available.map(function (item) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "model-click-item",
+        key: item === null || item === void 0 ? void 0 : item.name,
+        onClick: function onClick() {
+          var params = {
+            query: showQuestion === null || showQuestion === void 0 ? void 0 : showQuestion.originalQuestion,
+            searchType: SEARCH_TYPE.THIRD_PARTY_MODEL_SEARCH,
+            extInfo: {
+              thirdPartyModel: item,
+              messageId: dialogId
+            }
+          };
+          if (onClickThirdPartyModel && typeof onClickThirdPartyModel === 'function') {
+            onClickThirdPartyModel(params);
+          } else {
+            event.emit(ASSIST_CHAT_EVENT.ASSIST_CHAT_ON_SEND_MESSAGE, {
+              params: params
+            });
+          }
+        }
+      }, /*#__PURE__*/React.createElement(CSECustomIcon, {
+        type: "iconcopilot-ask-o",
+        size: "small"
+      }), /*#__PURE__*/React.createElement("span", {
+        className: "model-change-item-text"
+      }, "\u5411", item === null || item === void 0 ? void 0 : item.name, "\u63D0\u95EE"));
+    })), hasExecutedModel && /*#__PURE__*/React.createElement("span", {
+      className: "model-change-item-text"
+    }, "\u6765\u6E90: ", executed === null || executed === void 0 ? void 0 : executed.name)) : null;
+  };
+  var modalInfoTriggerRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    modalChangeVisible = _useState2[0],
+    setModalChangeVisible = _useState2[1];
+  var showModalInfo = function showModalInfo() {
+    var _ref2 = modalInfo || {},
+      currentModalCode = _ref2.currentModalCode,
+      modalDataList = _ref2.modalDataList;
+    if (Array.isArray(modalDataList) && (modalDataList === null || modalDataList === void 0 ? void 0 : modalDataList.length) > 1) {
+      var _modalInfoTriggerRef$;
+      var currentModalData = modalDataList.find(function (item) {
+        return (item === null || item === void 0 ? void 0 : item.code) === currentModalCode;
+      });
+      var showModalList = modalDataList.filter(function (item) {
+        return (item === null || item === void 0 ? void 0 : item.code) !== currentModalCode;
+      });
+      return /*#__PURE__*/React.createElement("div", {
+        className: "llm-model-info-container"
+      }, /*#__PURE__*/React.createElement(Dropdown, {
+        trigger: ['click'],
+        open: modalChangeVisible,
+        onOpenChange: setModalChangeVisible,
+        overlay: /*#__PURE__*/React.createElement("div", {
+          className: "llm-model-info-popup-list thin-scrollbar",
+          style: {
+            width: (_modalInfoTriggerRef$ = modalInfoTriggerRef.current) === null || _modalInfoTriggerRef$ === void 0 ? void 0 : _modalInfoTriggerRef$.offsetWidth
+          }
+        }, showModalList === null || showModalList === void 0 ? void 0 : showModalList.map(function (item) {
+          return /*#__PURE__*/React.createElement("div", {
+            key: item === null || item === void 0 ? void 0 : item.code,
+            className: "llm-model-info-popup-model-item",
+            onClick: function onClick() {
+              var params = {
+                query: showQuestion === null || showQuestion === void 0 ? void 0 : showQuestion.originalQuestion,
+                searchType: SEARCH_TYPE.THIRD_PARTY_MODEL_SEARCH,
+                extInfo: {
+                  thirdPartyModel: item,
+                  messageId: dialogId
+                }
+              };
+              if (onClickThirdPartyModel && typeof onClickThirdPartyModel === 'function') {
+                onClickThirdPartyModel(params);
+              } else {
+                event.emit(ASSIST_CHAT_EVENT.ASSIST_CHAT_ON_SEND_MESSAGE, {
+                  params: params
+                });
+              }
+              setModalChangeVisible(false);
+            }
+          }, (item === null || item === void 0 ? void 0 : item.name) || (item === null || item === void 0 ? void 0 : item.code));
+        }))
+      }, /*#__PURE__*/React.createElement("div", {
+        ref: modalInfoTriggerRef,
+        className: "llm-model-info-current-model"
+      }, (currentModalData === null || currentModalData === void 0 ? void 0 : currentModalData.name) || currentModalCode, /*#__PURE__*/React.createElement(CSECustomIcon, {
+        className: classNames('model-info-icon', modalChangeVisible ? 'model-info-icon-transform' : ''),
+        type: "iconchakangengduo",
+        size: "small"
+      }))));
+    }
+    return null;
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "llm-model-change-wrap"
+  }, showThirdPartyModel(), showModalInfo());
+};
+export default LlmModelChange;

package/es/components/LlmModelChange/index.scss

@@ -0,0 +1,60 @@
+.llm-model-change-wrap {
+  .llm-third-party-model-container {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 8px;
+    color: #717579;
+    margin: 4px 0;
+
+    .model-click-item {
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      border: 1px solid #dcdee0;
+      border-radius: 3px;
+      padding: 0 8px;
+      color: #393b3d;
+    }
+  }
+
+  .llm-model-info-container {
+    margin: 4px 0;
+
+    .llm-model-info-current-model {
+      background-color: #fafafa;
+      border-bottom: 1px solid #dcdee0;
+      border-top: 1px solid #dcdee0;
+      padding: 4px 0;
+      text-align: center;
+      cursor: pointer;
+
+      .model-info-icon {
+        margin-left: 4px;
+        cursor: pointer;
+        margin-top: -2px;
+        transition: transform 0.1s linear, -webkit-transform 0.1s linear;
+      }
+
+      .model-info-icon-transform {
+        transform: rotate(180deg);
+      }
+    }
+  }
+}
+
+.llm-model-info-popup-list {
+  background-color: #ffffff;
+  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
+  max-height: 150px;
+  overflow: auto;
+
+  .llm-model-info-popup-model-item {
+    padding: 8px 24px;
+    cursor: pointer;
+  }
+
+  .llm-model-info-popup-model-item:hover {
+    background-color: #e4eff7;
+  }
+}

package/es/components/LlmReference/index.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import type { IReference, IReferenceTypeMap } from '../ReferenceInfoItem';
+import './index.scss';
+export interface ILlmReferenceProps {
+    ticketId?: string;
+    dialogId?: string;
+    bizMessageId?: any;
+    referenceTypeMap?: IReferenceTypeMap;
+    commonLog?: (params: any) => void;
+    references?: IReference[];
+    onClickReference?: (params: {
+        reference: any;
+        type: string;
+        url: string;
+        title: string;
+    }) => void;
+    referenceExtraRender?: (params?: any) => React.ReactNode;
+}
+/**
+ * 引用信息展示
+ * @param props
+ * @returns
+ */
+declare const LlmReference: (props: ILlmReferenceProps) => React.JSX.Element;
+export default LlmReference;

package/es/components/LlmReference/index.js

@@ -0,0 +1,147 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useContext, useState } from 'react';
+import { customRequest } from '@alife/goc-request';
+import { event } from '@alife/goc-utils';
+import { ArrowDownO, ArrowRightO, EarthO } from '@alife/magic-icons';
+import { isMobile } from '@alife/magic-utils';
+import classNames from 'classnames';
+import { AssistantChatContext } from "../../context";
+import { ASSIST_CHAT_EVENT } from "../../constants/assistChatEvent";
+import { REFERENCE_TYPE_ENUM } from "../../constants/reference";
+import ReferenceInfoItem from "../ReferenceInfoItem";
+import "./index.scss";
+/**
+ * 引用信息展示
+ * @param props
+ * @returns
+ */
+var LlmReference = function LlmReference(props) {
+  var _ref = props || {},
+    ticketId = _ref.ticketId,
+    dialogId = _ref.dialogId,
+    bizMessageId = _ref.bizMessageId,
+    references = _ref.references,
+    commonLog = _ref.commonLog,
+    onClickReference = _ref.onClickReference,
+    referenceTypeMap = _ref.referenceTypeMap,
+    _ref$referenceExtraRe = _ref.referenceExtraRender,
+    referenceExtraRender = _ref$referenceExtraRe === void 0 ? null : _ref$referenceExtraRe;
+  var _useContext = useContext(AssistantChatContext),
+    isAssistant = _useContext.isAssistant;
+
+  // 控制引用信息是否折叠
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    referenceCollapse = _useState2[0],
+    setReferenceCollapse = _useState2[1]; // 默认折叠
+
+  // 唤起Agent模式
+  var openAgent = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(currentItem) {
+      var res;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return customRequest({
+              method: 'POST',
+              url: '/customerIntelligence/innerApi/v1/copilot/toolAutomate/formatAgentSchema',
+              query: {
+                ticketId: ticketId,
+                agentId: currentItem === null || currentItem === void 0 ? void 0 : currentItem.bizId,
+                uuid: currentItem === null || currentItem === void 0 ? void 0 : currentItem.uuid
+              }
+            });
+          case 2:
+            res = _context.sent;
+            if ((res === null || res === void 0 ? void 0 : res.code) === 0 && res !== null && res !== void 0 && res.data) {
+              event.emit(ASSIST_CHAT_EVENT.COPILOT_AGENT_SELECT_AND_OPEN, {
+                data: res === null || res === void 0 ? void 0 : res.data,
+                source: 'REFERENCE_AGENT'
+              });
+            }
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function openAgent(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var handleClickReference = function handleClickReference(data) {
+    if ((data === null || data === void 0 ? void 0 : data.type) === REFERENCE_TYPE_ENUM.agent) {
+      openAgent(data === null || data === void 0 ? void 0 : data.reference);
+    } else if (onClickReference && typeof onClickReference === 'function') {
+      onClickReference(data);
+    } else if (data !== null && data !== void 0 && data.url) {
+      window.open(data === null || data === void 0 ? void 0 : data.url);
+    }
+    commonLog === null || commonLog === void 0 || commonLog({
+      subEventName: 'llm_generate_reference_click',
+      operationType: 'on_click',
+      dataJson: _objectSpread({
+        bizMessageId: bizMessageId,
+        dialogId: dialogId
+      }, data)
+    });
+  };
+  return Array.isArray(references) && (references === null || references === void 0 ? void 0 : references.length) > 0 ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "llm-references-tag-wrap",
+    onClick: function onClick() {
+      // 如果是助手模式或者移动端，则直接平铺展示
+      if (isAssistant || isMobile) {
+        setReferenceCollapse(!referenceCollapse);
+      } else {
+        event.emit(ASSIST_CHAT_EVENT.COPILOT_REFERENCE_OPEN, {
+          data: {
+            references: references,
+            dialogId: dialogId,
+            referenceTypeMap: referenceTypeMap,
+            referenceExtraRender: referenceExtraRender
+          },
+          onClickReference: function onClickReference(data) {
+            return handleClickReference(data);
+          }
+        });
+      }
+    }
+  }, /*#__PURE__*/React.createElement(EarthO, {
+    className: "references-tag-icon"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "references-title-text"
+  }, references === null || references === void 0 ? void 0 : references.length, "\u7BC7\u53C2\u8003\u6765\u6E90"), isAssistant || isMobile ? /*#__PURE__*/React.createElement(ArrowDownO, {
+    className: classNames('references-collapse-icon', {
+      // 展开时显示向上箭头
+      'reference-tag-icon-transform': !referenceCollapse
+    })
+  }) : /*#__PURE__*/React.createElement(ArrowRightO, {
+    className: "references-tag-icon"
+  })), isAssistant || isMobile ? /*#__PURE__*/React.createElement("div", {
+    className: classNames('references-list', {
+      'references-list-collapse': referenceCollapse
+    })
+  }, references === null || references === void 0 ? void 0 : references.map(function (item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "references-list-item",
+      key: "".concat(item === null || item === void 0 ? void 0 : item.dataId)
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "references-list-index",
+      style: {
+        marginRight: 4
+      }
+    }, index + 1), /*#__PURE__*/React.createElement(ReferenceInfoItem, {
+      itemData: item,
+      referenceTypeMap: referenceTypeMap,
+      extRender: referenceExtraRender,
+      onClickReference: function onClickReference(data) {
+        return handleClickReference(data);
+      }
+    }));
+  })) : null) : null;
+};
+export default LlmReference;

package/es/components/LlmReference/index.scss

@@ -0,0 +1,92 @@
+.llm-card-references {
+  .references-wrap {
+    .references-title {
+      cursor: pointer;
+      font-weight: 500;
+
+      .reference-icon {
+        margin-top: -2px;
+        transition: transform 0.1s linear, -webkit-transform 0.1s linear;
+      }
+
+      .reference-icon-transform {
+        transform: rotate(180deg);
+      }
+    }
+  }
+
+  .next-divider-hoz {
+    margin: 4px 0;
+  }
+}
+
+.llm-references-tag-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #ffffff;
+  border: 1px solid #d4d6db;
+  border-radius: 19px;
+  padding: 7px 12px;
+  color: #81848f;
+  cursor: pointer;
+  width: max-content;
+  margin: 16px 0 4px;
+
+  &:hover {
+    background-color: #f5f6f7;
+  }
+
+  .references-tag-icon {
+    font-size: 16px;
+  }
+
+  .references-collapse-icon {
+    font-size: 16px;
+    transition: transform 0.1s linear, -webkit-transform 0.1s linear;
+  }
+
+  .reference-tag-icon-transform {
+    transform: rotate(180deg);
+  }
+
+  .references-title-text {
+    line-height: 22px;
+    margin-left: 4px;
+    font-size: 14px;
+  }
+}
+
+.references-list {
+  opacity: 1;
+  height: auto;
+  margin-top: 8px;
+
+  .references-list-item {
+    display: flex;
+    align-items: center;
+    margin-top: 4px;
+
+    .references-list-index {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      height: 16px;
+      min-width: 16px;
+      background: #e6e8eb;
+      color: #474a52;
+      font-size: 12px;
+      border-radius: 2px;
+    }
+
+    .reference-info-item {
+      margin-top: 0;
+    }
+  }
+}
+
+.references-list-collapse {
+  opacity: 0;
+  height: 0;
+  display: none;
+}

package/es/components/LlmTitle/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import './index.scss';
+export interface ILlmTitleProps {
+    title?: string;
+    icon?: string;
+    className?: string;
+}
+/**
+ * 标题组件
+ * @param props
+ * @returns
+ */
+declare const LlmTitle: (props: ILlmTitleProps) => React.JSX.Element;
+export default LlmTitle;

package/es/components/LlmTitle/index.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { CSECustomIcon } from "../../utils/CSEIconTool";
+import "./index.scss";
+/**
+ * 标题组件
+ * @param props
+ * @returns
+ */
+var LlmTitle = function LlmTitle(props) {
+  var _props$title = props.title,
+    title = _props$title === void 0 ? '大模型问答' : _props$title,
+    _props$icon = props.icon,
+    icon = _props$icon === void 0 ? 'iconAgent_Intelligent_O' : _props$icon,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "llm-title-container ".concat(className)
+  }, /*#__PURE__*/React.createElement(CSECustomIcon, {
+    className: "llm-title-icon",
+    type: icon,
+    size: "small"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "llm-title-text"
+  }, title));
+};
+export default LlmTitle;

package/es/components/LlmTitle/index.scss

@@ -0,0 +1,20 @@
+.llm-title-container {
+  display: flex;
+  align-items: center;
+  padding: 3px 8px;
+  background-image: linear-gradient(270deg, #f8ebfd 0%, #e5e1fe 100%);
+  border-radius: 4px 2px 2px 4px;
+
+  .llm-title-icon {
+    color: #7836cf;
+    margin-top: -2px;
+    margin-right: 4px;
+  }
+
+  .llm-title-text {
+    font-weight: 500;
+    font-size: 14px;
+    color: #171a1d;
+    line-height: 22px;
+  }
+}

package/es/components/LlmTrace/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import './index.scss';
+export interface ILlmTraceProps {
+    headTitle?: React.ReactNode;
+    trace?: any;
+    ticketId?: string;
+    dialogId?: string;
+    originData?: any;
+    finished?: boolean;
+}
+/**
+ * LLM 链路组件
+ * @param props
+ * @returns
+ */
+declare const LlmTrace: (props: ILlmTraceProps) => React.JSX.Element;
+export default LlmTrace;