@myun/gimi-chat 0.0.3 → 0.0.4

package/dist/components/knowledge-trace/KnowledgeIconComponent.js

@@ -0,0 +1,101 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import styles from "./index.module.scss";
+import { knowledgeConstants } from "../../constants";
+import { useAppDispatch, useAppSelector } from "../../store/hooks";
+import { setShowKonwledgeTrace, setKonwledgeTraceState } from "../../store/slices/gimiMenuSlice";
+import React from 'react';
+var KnowledgeIcon = function KnowledgeIcon(_ref) {
+  var url = _ref.url;
+  return /*#__PURE__*/React.createElement("img", {
+    style: {
+      width: '12px',
+      height: '12px'
+    },
+    alt: "\u77E5\u8BC6\u5E93\u6EAF\u6E90\u56FE\u6807",
+    src: url
+  });
+};
+export var KnowledgeIconComponent = function KnowledgeIconComponent(_ref2) {
+  var type = _ref2.type,
+    resources = _ref2.resources,
+    messageId = _ref2.messageId;
+  var dispatch = useAppDispatch();
+  var _useAppSelector = useAppSelector(function (state) {
+      return state.gimiMenu;
+    }),
+    messageList = _useAppSelector.messageList,
+    isMsgRecieving = _useAppSelector.isMsgRecieving;
+  var isLastMessage = (messageList === null || messageList === void 0 ? void 0 : messageList.length) > 0 && messageList[messageList.length - 1].id === messageId;
+  var iconUrl = type === 'video' ? knowledgeConstants.VIDEO_ICON_KNOWLADGE_TRACE_ADDRESS : type === 'document' ? knowledgeConstants.DOCUMENT_ICON_ADDRESS : knowledgeConstants.CLASS_ICON_ADDRESS;
+  var handleIconClick = function handleIconClick() {
+    if (isMsgRecieving && isLastMessage) return; // 最新一条正在流式输出的消息，不打开溯源面板
+    dispatch(setKonwledgeTraceState({
+      type: type,
+      resources: resources,
+      messageId: messageId
+    }));
+    dispatch(setShowKonwledgeTrace({
+      showKonwledgeTrace: true
+    }));
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.icon_btn,
+    onClick: handleIconClick
+  }, /*#__PURE__*/React.createElement(KnowledgeIcon, {
+    url: iconUrl
+  }), /*#__PURE__*/React.createElement("span", null, "".concat(resources === null || resources === void 0 ? void 0 : resources.length, "\u4E2A").concat(type === 'video' ? '视频' : type === 'product' ? '课程' : '文档')));
+};
+var KnowledgeIconGroup = function KnowledgeIconGroup(_ref3) {
+  var value = _ref3.value;
+  var knowledgeMap = React.useMemo(function () {
+    var returnMap = new Map();
+    try {
+      var parseArr = JSON.parse(value.content);
+      if (!Array.isArray(parseArr)) return returnMap;
+      parseArr.forEach(function (item) {
+        var orgArr = returnMap.get(item.type) || [];
+        // 判断是否map中已有该类型的知识溯源
+        if (orgArr.length > 0) {
+          // 防止重复添加id
+          returnMap.set(item.type, [].concat(_toConsumableArray(orgArr), [{
+            id: item.id,
+            productIds: item.productIds
+          }]));
+        } else {
+          returnMap.set(item.type, [{
+            id: item.id,
+            productIds: item.productIds
+          }]);
+        }
+      });
+      return returnMap;
+    } catch (error) {
+      return returnMap;
+    }
+  }, [value.content]);
+  var renderList = knowledgeMap.keys().toArray() || [];
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'inline-block'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      gap: '5px',
+      flexWrap: 'wrap'
+    }
+  }, renderList.map(function (item) {
+    return /*#__PURE__*/React.createElement(KnowledgeIconComponent, {
+      type: item,
+      resources: knowledgeMap.get(item) || [],
+      key: item,
+      messageId: value.messageId
+    });
+  })));
+};
+export default KnowledgeIconGroup;

package/dist/components/knowledge-trace/classList.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { IProduct } from './interfaces';
+declare const ClassList: React.FC<{
+    list: IProduct[];
+}>;
+export default ClassList;

package/dist/components/knowledge-trace/classList.js

@@ -0,0 +1,72 @@
+import styles from "./index.module.scss";
+import classNames from 'classnames';
+import React from 'react';
+import { Toast, Tooltip } from '@douyinfe/semi-ui';
+import { useAppSelector } from "../../store/hooks";
+var ClassItem = function ClassItem(_ref) {
+  var _konwledgeTraceState$, _item$name;
+  var item = _ref.item;
+  var konwledgeTraceState = useAppSelector(function (state) {
+    return state.gimiMenu.konwledgeTraceState;
+  });
+  var platform = useAppSelector(function (state) {
+    return state.gimiMenu.platform;
+  });
+  var isActive = (_konwledgeTraceState$ = konwledgeTraceState.resources) === null || _konwledgeTraceState$ === void 0 || (_konwledgeTraceState$ = _konwledgeTraceState$.map(function (item) {
+    return item.id;
+  })) === null || _konwledgeTraceState$ === void 0 ? void 0 : _konwledgeTraceState$.includes("".concat(item.id));
+  var tagContent = React.useMemo(function () {
+    if (item.showStyle === 0) return null;
+    var classes = item.showStyle === 1 ? styles.tag_badge_green : item.showStyle === 2 ? styles.tag_badge_warning : styles.tag_badge_default;
+    return /*#__PURE__*/React.createElement("div", {
+      className: classes
+    }, item.equityLabel);
+  }, [item.showStyle, item.equityLabel]);
+  var handleClick = function handleClick() {
+    if (item.isDelete === 1) return;
+    if (platform !== 'myun') return Toast.warning('当前平台不支持溯源跳转');
+    if (item.isJoinClass) {
+      if (item.productType === 'single') {
+        window.open("/courseDetail/".concat(item.gradeId));
+      } else {
+        window.open("/class-project/".concat(item.gradeId, "/").concat(item.id));
+      }
+    } else {
+      if (item.productType === 'single') {
+        window.open("/new-product/".concat(item.id));
+      } else {
+        window.open("/project-product/".concat(item.id));
+      }
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles.knowledge, item.isDelete === 1 ? styles.resource_deactive : isActive ? styles.active : ''),
+    onClick: handleClick
+  }, /*#__PURE__*/React.createElement("img", {
+    alt: "\u8BFE\u7A0B\u5C01\u9762",
+    className: styles.class_img,
+    src: item.productUrl
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.class_description
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.text
+  }, tagContent, /*#__PURE__*/React.createElement(Tooltip, {
+    content: item.name
+  }, ((_item$name = item.name) === null || _item$name === void 0 ? void 0 : _item$name.length) > 33 ? "".concat(item.name.substring(0, 33), "...") : item.name || '')), item.isDelete === 1 && /*#__PURE__*/React.createElement("div", {
+    className: styles.knowledge_trace_deactive
+  }, "\u8BFE\u7A0B\u5931\u6548")));
+};
+var ClassList = function ClassList(_ref2) {
+  var list = _ref2.list;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.knowledgeList
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.total
+  }, "\u672C\u5BF9\u8BDD\u5171".concat((list === null || list === void 0 ? void 0 : list.length) || 0, "\u4E2A\u8BFE\u7A0B")), list.map(function (item) {
+    return /*#__PURE__*/React.createElement(ClassItem, {
+      item: item,
+      key: item.id
+    });
+  }));
+};
+export default ClassList;

package/dist/components/knowledge-trace/documentList.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { ITeachingModuleResource } from './interfaces';
+declare const DocumentList: React.FC<{
+    list: ITeachingModuleResource[];
+}>;
+export default DocumentList;

package/dist/components/knowledge-trace/documentList.js

@@ -0,0 +1,75 @@
+import React from 'react';
+import styles from "./index.module.scss";
+import classNames from 'classnames';
+import { documentConstants } from "../../constants";
+import { Toast, Tooltip } from '@douyinfe/semi-ui';
+import { useAppSelector } from "../../store/hooks";
+var SUPPORT_PREVIEW_FILE_TYPE = ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'];
+var FileItem = function FileItem(_ref) {
+  var _konwledgeTraceState$;
+  var item = _ref.item;
+  var konwledgeTraceState = useAppSelector(function (state) {
+    return state.gimiMenu.konwledgeTraceState;
+  });
+  var platform = useAppSelector(function (state) {
+    return state.gimiMenu.platform;
+  });
+  var isActive = (_konwledgeTraceState$ = konwledgeTraceState.resources) === null || _konwledgeTraceState$ === void 0 || (_konwledgeTraceState$ = _konwledgeTraceState$.map(function (item) {
+    return item.id;
+  })) === null || _konwledgeTraceState$ === void 0 ? void 0 : _konwledgeTraceState$.includes("".concat(item.hostId));
+  var handleClick = function handleClick() {
+    if (item.isDelete === 1) return;
+    if (platform !== 'myun') return Toast.warning('当前平台不支持溯源跳转');
+    var searchParams = "gradeId=".concat(item.gradeId, "&teachModuleId=").concat(item.id, "&outlineId=").concat(item.courseId, "&phaseId=").concat(item.phaseId);
+    if (!item.gradeId) {
+      if (SUPPORT_PREVIEW_FILE_TYPE.includes(item.suffix)) {
+        var url = "https://view.officeapps.live.com/op/embed.aspx?src=".concat(encodeURIComponent(item.url));
+        window.open(url);
+      } else {
+        window.open(item.url);
+      }
+      return;
+    }
+    if (item.isJoinClass) {
+      window.open("/learningPage?".concat(searchParams));
+    } else {
+      if (item.productType === 'single') {
+        window.open("/new-product/".concat(item.productId, "?").concat(searchParams));
+      } else {
+        window.open("/project-product/".concat(item.productId, "?").concat(searchParams));
+      }
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles.knowledge, item.isDelete === 1 ? styles.resource_deactive : isActive ? styles.active : ''),
+    onClick: handleClick
+  }, /*#__PURE__*/React.createElement("img", {
+    alt: "\u6587\u6863\u56FE\u7247",
+    className: styles.img,
+    src: documentConstants[item.suffix] || documentConstants.default
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.description
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    content: item.name
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.text
+  }, item.name)), /*#__PURE__*/React.createElement("div", {
+    className: styles.timeTrace
+  }, "".concat(item.suffix, " | ").concat(item.sizeUnit)), item.isDelete === 1 && /*#__PURE__*/React.createElement("div", {
+    className: styles.knowledge_trace_deactive
+  }, "\u6587\u6863\u5931\u6548")));
+};
+var DocumentList = function DocumentList(_ref2) {
+  var list = _ref2.list;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.knowledgeList
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.total
+  }, "\u672C\u5BF9\u8BDD\u5171".concat((list === null || list === void 0 ? void 0 : list.length) || 0, "\u4E2A\u6587\u6863")), list.map(function (item) {
+    return /*#__PURE__*/React.createElement(FileItem, {
+      item: item,
+      key: item.id
+    });
+  }));
+};
+export default DocumentList;

package/dist/components/knowledge-trace/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export declare type KonwledgeType = 'video' | 'document' | 'product';
+export interface KonwledgeTraceState {
+    type: KonwledgeType;
+    resources: {
+        id: string;
+        productIds?: number[];
+    }[];
+    messageId: number;
+}
+declare const KonwledgeTrace: React.FC<{
+    targetElement?: HTMLElement;
+    chatList: any[];
+    isOverFlow: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}>;
+export default KonwledgeTrace;

package/dist/components/knowledge-trace/index.js

@@ -0,0 +1,155 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React from 'react';
+import styles from "./index.module.scss";
+import { useAppSelector, useAppDispatch } from "../../store/hooks";
+import { setShowKonwledgeTrace, setKonwledgeTraceState } from "../../store/slices/gimiMenuSlice";
+import { Tabs, TabPane } from '@douyinfe/semi-ui';
+import VideoList from "./videoList";
+import DocumentList from "./documentList";
+import ClassList from "./classList";
+import { getKnowledgeTraceListFromConent } from "../../utils/tools";
+import useKnowledgeService from "../../hooks/useKnowledgeService";
+import AiLoading from "../ai-loading";
+import ReactDOM from 'react-dom';
+import GimiSideBar from "../gimi-sidebar";
+var KonwledgeTrace = function KonwledgeTrace(_ref) {
+  var targetElement = _ref.targetElement,
+    chatList = _ref.chatList,
+    isOverFlow = _ref.isOverFlow,
+    className = _ref.className,
+    style = _ref.style;
+  var showKonwledgeTrace = useAppSelector(function (state) {
+    return state.gimiMenu.showKonwledgeTrace;
+  });
+  var konwledgeTraceState = useAppSelector(function (state) {
+    return state.gimiMenu.konwledgeTraceState;
+  });
+  var dispatch = useAppDispatch();
+  var _React$useState = React.useState([]),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    tabList = _React$useState2[0],
+    setTabList = _React$useState2[1];
+  var _React$useState3 = React.useState(''),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    activeKey = _React$useState4[0],
+    setActiveKey = _React$useState4[1];
+  var tabPaneRef = React.useRef(null);
+  var kowledgeTraceList = React.useMemo(function () {
+    var matchIndex = chatList.findIndex(function (item) {
+      return item.id === konwledgeTraceState.messageId;
+    });
+    var matchMessage = chatList[matchIndex];
+    var sendMessage = chatList[matchIndex - 1];
+    if (!matchMessage) return [];
+    return getKnowledgeTraceListFromConent(matchMessage, sendMessage);
+  }, [chatList, konwledgeTraceState.messageId]);
+  var handleClose = React.useCallback(function () {
+    dispatch(setShowKonwledgeTrace({
+      showKonwledgeTrace: false
+    }));
+    dispatch(setKonwledgeTraceState({
+      type: 'video',
+      resources: [],
+      messageId: null
+    }));
+  }, [dispatch]);
+  React.useEffect(function () {
+    if ((kowledgeTraceList === null || kowledgeTraceList === void 0 ? void 0 : kowledgeTraceList.length) > 0) {
+      setTabList(function () {
+        return kowledgeTraceList.map(function (item) {
+          return {
+            name: item.type === 'document' ? '文档' : item.type === 'video' ? '视频' : '课程',
+            type: item.type
+          };
+        });
+      });
+    }
+  }, [kowledgeTraceList]);
+  var _useKnowledgeService = useKnowledgeService(kowledgeTraceList),
+    videoSliceList = _useKnowledgeService.videoSliceList,
+    documentList = _useKnowledgeService.documentList,
+    productList = _useKnowledgeService.productList,
+    isLoading = _useKnowledgeService.isLoading;
+  React.useEffect(function () {
+    setActiveKey(konwledgeTraceState.type);
+  }, [konwledgeTraceState.type]);
+  React.useEffect(function () {
+    var timer = setTimeout(function () {
+      var _tabPaneRef$current;
+      var tabPane = (_tabPaneRef$current = tabPaneRef.current) === null || _tabPaneRef$current === void 0 ? void 0 : _tabPaneRef$current.contentRef.current;
+      if (!tabPane) return;
+      // 滚动到第一个匹配的溯源项
+      var activeElement = tabPane.querySelector(".".concat(styles.active));
+      if (activeElement) {
+        // 检查是否有滚动条
+        if (tabPane.scrollHeight > tabPane.clientHeight) {
+          activeElement.scrollIntoView({
+            behavior: 'smooth',
+            block: 'start'
+          });
+        }
+      }
+    }, 100);
+    return function () {
+      return clearTimeout(timer);
+    };
+  }, [konwledgeTraceState]);
+  var handleTabChange = function handleTabChange(activeKey) {
+    setActiveKey(activeKey);
+  };
+  var tabContent = React.useMemo(function () {
+    if (isLoading) return /*#__PURE__*/React.createElement(AiLoading, null);
+    switch (activeKey) {
+      case 'video':
+        return /*#__PURE__*/React.createElement(VideoList, {
+          list: videoSliceList
+        });
+      case 'product':
+        return /*#__PURE__*/React.createElement(ClassList, {
+          list: productList
+        });
+      case 'document':
+        return /*#__PURE__*/React.createElement(DocumentList, {
+          list: documentList
+        });
+      default:
+        return null;
+    }
+  }, [activeKey, videoSliceList, productList, documentList, isLoading]);
+  var renderContent = function renderContent() {
+    return /*#__PURE__*/React.createElement(GimiSideBar, {
+      show: showKonwledgeTrace,
+      isOverFlow: isOverFlow,
+      ref: tabPaneRef,
+      title: "\u5F15\u7528\u6765\u6E90",
+      handleClose: handleClose,
+      style: style,
+      className: className
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.tabs
+    }, (tabList === null || tabList === void 0 ? void 0 : tabList.length) > 1 ? /*#__PURE__*/React.createElement(Tabs, {
+      type: "button",
+      size: "small",
+      activeKey: activeKey,
+      onChange: handleTabChange
+    }, tabList.map(function (tab) {
+      return /*#__PURE__*/React.createElement(TabPane, {
+        tab: tab.name,
+        itemKey: tab.type,
+        key: tab.type
+      }, tabContent);
+    })) : tabContent));
+  };
+  if (isOverFlow && (kowledgeTraceList === null || kowledgeTraceList === void 0 ? void 0 : kowledgeTraceList.length) > 0) {
+    var targetElm = targetElement || document.getElementById('myun_gimi_design_chat');
+    if (!targetElm) return null;
+    return /*#__PURE__*/ReactDOM.createPortal(renderContent(), targetElm);
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, (kowledgeTraceList === null || kowledgeTraceList === void 0 ? void 0 : kowledgeTraceList.length) > 0 ? renderContent() : null);
+};
+export default KonwledgeTrace;