1 line
8.1 KiB
Plaintext
1 line
8.1 KiB
Plaintext
{"version":3,"file":"index.js","sources":["../../../../../../src/modules/mall/chat/index.vue","../../../../../../uniPage:/bW9kdWxlc1xtYWxsXGNoYXRcaW5kZXgudnVl"],"sourcesContent":["<template>\r\n <s-layout\r\n class=\"chat-wrap\"\r\n :title=\"!isReconnecting ? '连接客服成功' : '会话重连中'\"\r\n navbar=\"inner\"\r\n >\r\n <!-- 覆盖头部导航栏背景颜色 -->\r\n <div class=\"page-bg\" :style=\"{ height: sys_navBar + 'px' }\"></div>\r\n <!-- 聊天区域 -->\r\n <MessageList ref=\"messageListRef\">\r\n <template #bottom>\r\n <message-input\r\n v-model=\"chat.msg\"\r\n @on-tools=\"onTools\"\r\n @send-message=\"onSendMessage\"\r\n ></message-input>\r\n </template>\r\n </MessageList>\r\n <!-- 聊天工具 -->\r\n <tools-popup\r\n :show-tools=\"chat.showTools\"\r\n :tools-mode=\"chat.toolsMode\"\r\n @close=\"handleToolsClose\"\r\n @on-emoji=\"onEmoji\"\r\n @image-select=\"onSelect\"\r\n @on-show-select=\"onShowSelect\"\r\n >\r\n <message-input\r\n v-model=\"chat.msg\"\r\n @on-tools=\"onTools\"\r\n @send-message=\"onSendMessage\"\r\n ></message-input>\r\n </tools-popup>\r\n <!-- 商品订单选择 -->\r\n <SelectPopup\r\n :mode=\"chat.selectMode\"\r\n :show=\"chat.showSelect\"\r\n @select=\"onSelect\"\r\n @close=\"chat.showSelect = false\"\r\n />\r\n </s-layout>\r\n</template>\r\n\r\n<script setup>\r\nimport MessageList from '@/modules/mall/chat/components/messageList.vue'\r\nimport { reactive, ref, toRefs } from 'vue'\r\nimport sheep from '@/sheep'\r\nimport ToolsPopup from '@/modules/mall/chat/components/toolsPopup.vue'\r\nimport MessageInput from '@/modules/mall/chat/components/messageInput.vue'\r\nimport SelectPopup from '@/modules/mall/chat/components/select-popup.vue'\r\nimport {\r\n KeFuMessageContentTypeEnum,\r\n WebSocketMessageTypeConstants,\r\n} from '@/modules/mall/chat/util/constants'\r\nimport FileApi from '@/sheep/api/infra/file'\r\nimport KeFuApi from '@/sheep/api/promotion/kefu'\r\nimport { useWebSocket } from '@/sheep/hooks/useWebSocket'\r\n\r\nconst sys_navBar = sheep.$platform.navbar\r\n\r\nconst chat = reactive({\r\n msg: '',\r\n scrollInto: '',\r\n showTools: false,\r\n toolsMode: '',\r\n showSelect: false,\r\n selectMode: '',\r\n})\r\n\r\n// 发送消息\r\nasync function onSendMessage() {\r\n if (!chat.msg) return\r\n try {\r\n const data = {\r\n contentType: KeFuMessageContentTypeEnum.TEXT,\r\n content: chat.msg,\r\n }\r\n await KeFuApi.sendKefuMessage(data)\r\n await messageListRef.value.refreshMessageList()\r\n chat.msg = ''\r\n } finally {\r\n chat.showTools = false\r\n }\r\n}\r\n\r\nconst messageListRef = ref()\r\n\r\n//= ====================== 聊天工具相关 start =======================\r\n\r\nfunction handleToolsClose() {\r\n chat.showTools = false\r\n chat.toolsMode = ''\r\n}\r\n\r\nfunction onEmoji(item) {\r\n chat.msg += item.name\r\n}\r\n\r\n// 点击工具栏开关\r\nfunction onTools(mode) {\r\n if (isReconnecting.value) {\r\n sheep.$helper.toast('您已掉线!请返回重试')\r\n return\r\n }\r\n\r\n if (!chat.toolsMode || chat.toolsMode === mode) {\r\n chat.showTools = !chat.showTools\r\n }\r\n chat.toolsMode = mode\r\n if (!chat.showTools) {\r\n chat.toolsMode = ''\r\n }\r\n}\r\n\r\nfunction onShowSelect(mode) {\r\n chat.showTools = false\r\n chat.showSelect = true\r\n chat.selectMode = mode\r\n}\r\n\r\nasync function onSelect({ type, data }) {\r\n let msg\r\n switch (type) {\r\n case 'image':\r\n const res = await FileApi.uploadFile(data.tempFiles[0].path)\r\n msg = {\r\n contentType: KeFuMessageContentTypeEnum.IMAGE,\r\n content: res.data,\r\n }\r\n break\r\n case 'goods':\r\n msg = {\r\n contentType: KeFuMessageContentTypeEnum.PRODUCT,\r\n content: JSON.stringify(data),\r\n }\r\n break\r\n case 'order':\r\n msg = {\r\n contentType: KeFuMessageContentTypeEnum.ORDER,\r\n content: JSON.stringify(data),\r\n }\r\n break\r\n }\r\n if (msg) {\r\n // 发送消息\r\n // scrollBottom();\r\n await KeFuApi.sendKefuMessage(msg)\r\n await messageListRef.value.refreshMessageList()\r\n chat.showTools = false\r\n chat.showSelect = false\r\n chat.selectMode = ''\r\n }\r\n}\r\n\r\n//= ====================== 聊天工具相关 end =======================\r\nconst { options } = useWebSocket({\r\n // 连接成功\r\n onConnected: async () => {},\r\n // 收到消息\r\n onMessage: async (data) => {\r\n const type = data.type\r\n if (!type) {\r\n console.error('未知的消息类型:' + data.value)\r\n return\r\n }\r\n // 2.2 消息类型:KEFU_MESSAGE_TYPE\r\n if (type === WebSocketMessageTypeConstants.KEFU_MESSAGE_TYPE) {\r\n // 刷新消息列表\r\n await messageListRef.value.refreshMessageList(JSON.parse(data.content))\r\n return\r\n }\r\n // 2.3 消息类型:KEFU_MESSAGE_ADMIN_READ\r\n if (type === WebSocketMessageTypeConstants.KEFU_MESSAGE_ADMIN_READ) {\r\n console.log('管理员已读消息')\r\n }\r\n },\r\n})\r\nconst isReconnecting = toRefs(options).isReconnecting // 重连状态\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n.chat-wrap {\r\n .page-bg {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n z-index: 1;\r\n width: 100%;\r\n background-color: var(--ui-BG-Main);\r\n }\r\n\r\n .status {\r\n position: relative;\r\n z-index: 3;\r\n box-sizing: border-box;\r\n display: flex;\r\n align-items: center;\r\n height: 70rpx;\r\n padding: 0 30rpx;\r\n font-size: 30rpx;\r\n font-weight: 400;\r\n color: var(--ui-BG-Main);\r\n background: var(--ui-BG-Main-opacity-1);\r\n }\r\n}\r\n</style>\r\n","import MiniProgramPage from 'D:/App/Work/addr/acdr-ui/src/modules/mall/chat/index.vue'\nwx.createPage(MiniProgramPage)"],"names":["sheep","reactive","KeFuMessageContentTypeEnum","KeFuApi","ref","FileApi","useWebSocket","WebSocketMessageTypeConstants","toRefs"],"mappings":"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"} |