From 5c6f56aafa22896233b648c5a4fe175d230f5ca1 Mon Sep 17 00:00:00 2001 From: tangtaoit Date: Wed, 23 Aug 2023 13:53:27 +0800 Subject: [PATCH] fix: file display error --- apps/web/package.json | 9 ++- apps/web/src/index.tsx | 9 ++- packages/tsdaodaobase/package.json | 2 +- .../src/Components/Conversation/context.ts | 7 ++ .../src/Components/Conversation/index.tsx | 31 ++++++-- .../src/Messages/LottieSticker/index.tsx | 1 + .../tsdaodaobase/src/Messages/MessageCell.tsx | 5 +- .../tsdaodaobase/src/Messages/Voice/index.tsx | 5 +- yarn.lock | 72 +++++++++++++++++-- 9 files changed, 122 insertions(+), 19 deletions(-) diff --git a/apps/web/package.json b/apps/web/package.json index e772d48..aa349c9 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -4,16 +4,21 @@ "private": true, "homepage": "./", "dependencies": { + "@tauri-apps/api": "1.1.0", "@tsdaodao/base": "*", "@tsdaodao/contacts": "*", "@tsdaodao/datasource": "*", "@tsdaodao/login": "*", - "@tauri-apps/api": "1.1.0", + "@types/react-lazyload": "^3.2.0", "@types/react-mentions": "^4.1.5", + "@types/react-virtualized": "^9.21.22", "classnames": "^2.3.1", "react": "^17.0.2", "react-app-rewired": "^2.1.8", + "react-lazyload": "^3.2.0", "react-mentions": "^4.3.1", + "react-virtualized": "^9.22.5", + "react-virtuoso": "^4.5.0", "web-vitals": "^2.1.4" }, "devDependencies": { @@ -34,7 +39,7 @@ }, "scripts": { "start": "cross-env BROWSER=none REACT_APP_VERSION=$npm_package_version react-app-rewired start", - "dev": "cross-env BROWSER=none REACT_APP_VERSION=$npm_package_version react-app-rewired start", + "dev": "cross-env MODE=dev BROWSER=none REACT_APP_VERSION=$npm_package_version react-app-rewired start", "build": "cross-env REACT_APP_VERSION=$npm_package_version react-app-rewired build", "build:analyzer": "cross-env ANALYZER=true REACT_APP_VERSION=$npm_package_version react-app-rewired build", "test": "react-app-rewired test", diff --git a/apps/web/src/index.tsx b/apps/web/src/index.tsx index 0fa403c..d522fd7 100644 --- a/apps/web/src/index.tsx +++ b/apps/web/src/index.tsx @@ -9,8 +9,13 @@ import { DataSourceModule } from '@tsdaodao/datasource'; import {ContactsModule} from '@tsdaodao/contacts'; -// WKApp.apiClient.config.apiURL = "https://api.botgate.cn/v1/" -WKApp.apiClient.config.apiURL = "/api/v1/" // 正式环境地址 (通用打包镜像，用此相对地址) +if(process.env.NODE_ENV === "development") { + WKApp.apiClient.config.apiURL = "https://api.botgate.cn/v1/" +}else { + WKApp.apiClient.config.apiURL = "/api/v1/" // 正式环境地址 (通用打包镜像，用此相对地址),打包出来的镜像可以通过API_URL环境变量来修改API地址 +} + + WKApp.apiClient.config.tokenCallback = ()=> { return WKApp.loginInfo.token } diff --git a/packages/tsdaodaobase/package.json b/packages/tsdaodaobase/package.json index 6c20ccd..95793be 100644 --- a/packages/tsdaodaobase/package.json +++ b/packages/tsdaodaobase/package.json @@ -14,7 +14,7 @@ "benz-amr-recorder": "^1.1.3", "classnames": "^2.3.1", "hotkeys-js": "^3.8.7", - "wukongimjssdk": "^1.0.8", + "wukongimjssdk": "^1.1.1", "moment": "^2.29.3", "qrcode.react": "^1.0.1", "react": "^17.0.2", diff --git a/packages/tsdaodaobase/src/Components/Conversation/context.ts b/packages/tsdaodaobase/src/Components/Conversation/context.ts index cdbccdc..12df621 100644 --- a/packages/tsdaodaobase/src/Components/Conversation/context.ts +++ b/packages/tsdaodaobase/src/Components/Conversation/context.ts @@ -93,4 +93,11 @@ export default interface ConversationContext { * @param tip 是否提醒 */ locateMessage(messageSeq:number):any + + /** + * 获取消息容器id + */ + getMessageContainerId():string + + getMessageContainer():Element|undefined } \ No newline at end of file diff --git a/packages/tsdaodaobase/src/Components/Conversation/index.tsx b/packages/tsdaodaobase/src/Components/Conversation/index.tsx index 1d362ac..81c7dff 100644 --- a/packages/tsdaodaobase/src/Components/Conversation/index.tsx +++ b/packages/tsdaodaobase/src/Components/Conversation/index.tsx @@ -1,4 +1,4 @@ -import { Channel, ChannelTypeGroup, ChannelTypePerson, ConversationAction, WKSDK, Mention, Message, MessageContent, Reminder, ReminderType, Reply,MessageText } from "wukongimjssdk"; +import { Channel, ChannelTypeGroup, ChannelTypePerson, ConversationAction, WKSDK, Mention, Message, MessageContent, Reminder, ReminderType, Reply, MessageText } from "wukongimjssdk"; import React, { Component, HTMLProps } from "react"; import Provider from "../../Service/Provider"; import ConversationVM from "./vm"; @@ -34,6 +34,7 @@ export class Conversation extends Component implements Conver scrollTimer?: NodeJS.Timer updateBrowseToMessageSeqAndReminderDoneing: boolean = false private _dragFileCallback?: (file: File) => void + private _self = this; constructor(props: any) { super(props) @@ -160,6 +161,18 @@ export class Conversation extends Component implements Conver messageInputContext(): MessageInputContext { return this._messageInputContext } + getMessageContainerId(): string { + return this.vm.messageContainerId + } + + getMessageContainer(): Element|undefined { + const el = document.getElementById(this.vm.messageContainerId) + console.log("getMessageContainer--->",el) + if (!el) { + return undefined + } + return el + } componentDidMount() { @@ -240,7 +253,7 @@ export class Conversation extends Component implements Conver this.setState({}) }} key={message.clientMsgNo} id={`${message.contentType === MessageContentTypeConst.time ? "time-" : ""}${message.clientMsgNo}`} className={classNames("wk-message-item", last ? "wk-message-item-last" : undefined, message.locateRemind ? 'wk-message-item-reminder' : undefined)} > { - MessageCell ? : null + MessageCell ? : null } @@ -250,12 +263,18 @@ export class Conversation extends Component implements Conver if (this.scrollTimer) { clearTimeout(this.scrollTimer) } + const scrollTop = e.target.scrollTop; + const scrollHeight = e.target.scrollHeight; + const clientHeight = e.clientHeight; this.scrollTimer = setTimeout(() => { this.handleScrollEnd() }, 500) - this.contextMenusContext.hide() - const targetScrollTop = e.target.scrollTop; - const scrollOffsetTop = e.target.scrollHeight - (targetScrollTop + e.target.clientHeight); + if (this.contextMenusContext) { + this.contextMenusContext.hide() + } + + const targetScrollTop = scrollTop; + const scrollOffsetTop = scrollHeight - (targetScrollTop + clientHeight); // console.log("targetScrollTop---->",targetScrollTop,scrollOffsetTop,this.vm.loading,this.vm.pullupHasMore) if (targetScrollTop <= 250 && !this.vm.loading && !this.vm.pulldownFinished) { // 下拉 this.vm.pulldownMessages() @@ -462,6 +481,7 @@ export class Conversation extends Component implements Conver this.vm.notifyListener() } + render() { const { chatBg, channel } = this.props @@ -481,6 +501,7 @@ export class Conversation extends Component implements Conver this.dragStart() }} className={classNames("wk-conversation-content")}> +
{ vm.messages.map((message, i) => { diff --git a/packages/tsdaodaobase/src/Messages/LottieSticker/index.tsx b/packages/tsdaodaobase/src/Messages/LottieSticker/index.tsx index dc1f469..8d804d3 100644 --- a/packages/tsdaodaobase/src/Messages/LottieSticker/index.tsx +++ b/packages/tsdaodaobase/src/Messages/LottieSticker/index.tsx @@ -5,6 +5,7 @@ import { MessageContentTypeConst } from "../../Service/Const" import MessageBase from "../Base" import { MessageCell } from "../MessageCell" import "@lottiefiles/lottie-player/dist/tgs-player"; +import LazyLoad from 'react-lazyload'; diff --git a/packages/tsdaodaobase/src/Messages/MessageCell.tsx b/packages/tsdaodaobase/src/Messages/MessageCell.tsx index 68da225..a183062 100644 --- a/packages/tsdaodaobase/src/Messages/MessageCell.tsx +++ b/packages/tsdaodaobase/src/Messages/MessageCell.tsx @@ -14,12 +14,15 @@ class MessageBaseCellPropsImp implements MessageBaseCellProps { } export class MessageBaseCell

extends Component { - + } export class MessageCell

extends MessageBaseCell { + componentDidMount(): void { + } + render() { return

MessageCell
} diff --git a/packages/tsdaodaobase/src/Messages/Voice/index.tsx b/packages/tsdaodaobase/src/Messages/Voice/index.tsx index 79682d8..8bc6683 100644 --- a/packages/tsdaodaobase/src/Messages/Voice/index.tsx +++ b/packages/tsdaodaobase/src/Messages/Voice/index.tsx @@ -8,7 +8,6 @@ import MessageTrail from "../Base/tail" import MessageBase from "../Base" import WKApp from "../../App" import { MessageContentTypeConst } from "../../Service/Const" -import { MessageWrap } from "../../Service/Model" var BenzAMRRecorder = require('benz-amr-recorder'); @@ -224,9 +223,9 @@ export class VoiceCell extends MessageCell { }
- +
- +
diff --git a/yarn.lock b/yarn.lock index 2938287..31fe357 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1063,6 +1063,13 @@ dependencies: regenerator-runtime "^0.13.4" +"@babel/runtime@^7.7.2", "@babel/runtime@^7.8.7": + version "7.22.10" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.10.tgz#ae3e9631fd947cb7e3610d3e9d8fef5f76696682" + integrity sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ== + dependencies: + regenerator-runtime "^0.14.0" + "@babel/template@^7.10.4", "@babel/template@^7.18.10", "@babel/template@^7.3.3": version "7.18.10" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.18.10.tgz#6f9134835970d1dbf0835c0d100c9f38de0c5e71" @@ -2195,6 +2202,13 @@ dependencies: "@types/react" "*" +"@types/react-lazyload@^3.2.0": + version "3.2.0" + resolved "https://registry.yarnpkg.com/@types/react-lazyload/-/react-lazyload-3.2.0.tgz#b763f8f0c724df2c969d7e0b3a56c6aa2720fa1f" + integrity sha512-4+r+z8Cf7L/mgxA1vl5uHx5GS/8gY2jqq2p5r5WCm+nUsg9KilwQ+8uaJA3EUlLj57AOzOfGGwwRJ5LOVl8fwA== + dependencies: + "@types/react" "*" + "@types/react-mentions@^4.1.5": version "4.1.6" resolved "https://registry.yarnpkg.com/@types/react-mentions/-/react-mentions-4.1.6.tgz#0ecdb61785c22edbf9c7d6718505d4814ad3a65c" @@ -2209,6 +2223,14 @@ dependencies: "@types/react" "*" +"@types/react-virtualized@^9.21.22": + version "9.21.22" + resolved "https://registry.yarnpkg.com/@types/react-virtualized/-/react-virtualized-9.21.22.tgz#5ba39b29869200620a6bf2069b8393f258a9c1e2" + integrity sha512-YRifyCKnBG84+J/Hny0f3bo8BRrcNT74CvsAVpQpZcS83fdC7lP7RfzwL2ND8/ihhpnDFL1IbxJ9MpQNaKUDuQ== + dependencies: + "@types/prop-types" "*" + "@types/react" "*" + "@types/react@*": version "18.0.20" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.20.tgz#e4c36be3a55eb5b456ecf501bd4a00fd4fd0c9ab" @@ -3853,7 +3875,7 @@ cliui@^6.0.0: strip-ansi "^6.0.0" wrap-ansi "^6.2.0" -clsx@^1.1.1: +clsx@^1.0.4, clsx@^1.1.1: version "1.2.1" resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12" integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg== @@ -4743,6 +4765,14 @@ dom-converter@^0.2.0: dependencies: utila "~0.4" +dom-helpers@^5.1.3: + version "5.2.1" + resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902" + integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA== + dependencies: + "@babel/runtime" "^7.8.7" + csstype "^3.0.2" + dom-serializer@0: version "0.2.2" resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51" @@ -9914,6 +9944,16 @@ react-is@^17.0.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0" integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w== +react-lazyload@^3.2.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/react-lazyload/-/react-lazyload-3.2.0.tgz#497bd06a6dbd7015e3376e1137a67dc47d2dd021" + integrity sha512-zJlrG8QyVZz4+xkYZH5v1w3YaP5wEFaYSUWC4CT9UXfK75IfRAIEdnyIUF+dXr3kX2MOtL1lUaZmaQZqrETwgw== + +react-lifecycles-compat@^3.0.4: + version "3.0.4" + resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" + integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA== + react-mentions@^4.3.1: version "4.4.7" resolved "https://registry.yarnpkg.com/react-mentions/-/react-mentions-4.4.7.tgz#af8dce00f50ed8be23e46040e7c6f3f3e7a79c13" @@ -10034,6 +10074,23 @@ react-viewer@^3.2.2: dependencies: classnames "^2.2.5" +react-virtualized@^9.22.5: + version "9.22.5" + resolved "https://registry.yarnpkg.com/react-virtualized/-/react-virtualized-9.22.5.tgz#bfb96fed519de378b50d8c0064b92994b3b91620" + integrity sha512-YqQMRzlVANBv1L/7r63OHa2b0ZsAaDp1UhVNEdUaXI8A5u6hTpA5NYtUueLH2rFuY/27mTGIBl7ZhqFKzw18YQ== + dependencies: + "@babel/runtime" "^7.7.2" + clsx "^1.0.4" + dom-helpers "^5.1.3" + loose-envify "^1.4.0" + prop-types "^15.7.2" + react-lifecycles-compat "^3.0.4" + +react-virtuoso@^4.5.0: + version "4.5.0" + resolved "https://registry.yarnpkg.com/react-virtuoso/-/react-virtuoso-4.5.0.tgz#0bc043b4e3e928e7891aa541dd7e55d5b46db8c8" + integrity sha512-OMP6XrzJMMos1vbJZC16RxGW7utAxUMP7i5PNPi6epBNVH7nz+CF/DlmecNBep5wyjLud51dQ5epjb2A0w9W/Q== + react-window@^1.8.2: version "1.8.7" resolved "https://registry.yarnpkg.com/react-window/-/react-window-1.8.7.tgz#5e9fd0d23f48f432d7022cdb327219353a15f0d4" @@ -10144,6 +10201,11 @@ regenerator-runtime@^0.13.2, regenerator-runtime@^0.13.4, regenerator-runtime@^0 resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52" integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA== +regenerator-runtime@^0.14.0: + version "0.14.0" + resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45" + integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA== + regenerator-transform@^0.15.0: version "0.15.0" resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.0.tgz#cbd9ead5d77fae1a48d957cf889ad0586adb6537" @@ -12465,10 +12527,10 @@ ws@^7.3.1, ws@^7.4.6: resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.9.tgz#54fa7db29f4c7cec68b1ddd3a89de099942bb591" integrity sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q== -wukongimjssdk@^1.0.8: - version "1.0.8" - resolved "https://registry.yarnpkg.com/wukongimjssdk/-/wukongimjssdk-1.0.8.tgz#33119bf1d8e751bba2118e5e4ba514addde214aa" - integrity sha512-EN5k35r9WLtNray3fT9EK04sqJMUXmKc9T7U2mChVs0eXIlChXUDX4uUz834EASzndtrIqgIlsR2pgGAdXdE7Q== +wukongimjssdk@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/wukongimjssdk/-/wukongimjssdk-1.1.1.tgz#c0c723016d6198d16a2af0b44b9e806dc1b2378f" + integrity sha512-2CPnKL55V6TWVA/nTK8g3Hs0Z4REqSIxtkEiM1x2SZqDnfgdjv2E6qAU8vatC2K/9d7gL8vXKKZiSNoCo9F3aA== dependencies: "@types/bignumber.js" "^5.0.0" "@types/crypto-js" "^4.0.2"