diff --git a/package-lock.json b/package-lock.json index fbe70ed..4c7c73e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.0.0", "dependencies": { "@element-plus/icons-vue": "^2.3.1", + "@types/socket.io-client": "^3.0.0", "@wangeditor/editor": "^5.1.23", "@wangeditor/editor-for-vue": "^5.1.12", "axios": "^1.6.2", @@ -17,6 +18,7 @@ "element-plus": "^2.4.4", "nprogress": "^0.2.0", "pinia": "^2.1.7", + "socket.io-client": "^4.8.1", "vue": "^3.3.11", "vue-echarts": "^6.6.1", "vue-router": "^4.2.5" @@ -1124,6 +1126,11 @@ "win32" ] }, + "node_modules/@socket.io/component-emitter": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz", + "integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==" + }, "node_modules/@transloadit/prettier-bytes": { "version": "0.0.7", "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.0.7.tgz", @@ -1167,6 +1174,15 @@ "@types/lodash": "*" } }, + "node_modules/@types/socket.io-client": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@types/socket.io-client/-/socket.io-client-3.0.0.tgz", + "integrity": "sha512-s+IPvFoEIjKA3RdJz/Z2dGR4gLgysKi8owcnrVwNjgvc01Lk68LJDDsG2GRqegFITcxmvCMYM7bhMpwEMlHmDg==", + "deprecated": "This is a stub types definition. socket.io-client provides its own type definitions, so you do not need this installed.", + "dependencies": { + "socket.io-client": "*" + } + }, "node_modules/@types/web-bluetooth": { "version": "0.0.16", "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz", @@ -1450,7 +1466,6 @@ "version": "5.1.23", "resolved": "https://registry.npmjs.org/@wangeditor/editor/-/editor-5.1.23.tgz", "integrity": "sha512-0RxfeVTuK1tktUaPROnCoFfaHVJpRAIE2zdS0mpP+vq1axVQpLjM8+fCvKzqYIkH0Pg+C+44hJpe3VVroSkEuQ==", - "license": "MIT", "dependencies": { "@uppy/core": "^2.1.1", "@uppy/xhr-upload": "^2.0.3", @@ -1479,7 +1494,6 @@ "version": "5.1.12", "resolved": "https://registry.npmjs.org/@wangeditor/editor-for-vue/-/editor-for-vue-5.1.12.tgz", "integrity": "sha512-0Ds3D8I+xnpNWezAeO7HmPRgTfUxHLMd9JKcIw+QzvSmhC5xUHbpCcLU+KLmeBKTR/zffnS5GQo6qi3GhTMJWQ==", - "license": "MIT", "peerDependencies": { "@wangeditor/editor": ">=5.1.0", "vue": "^3.0.5" @@ -1741,6 +1755,22 @@ "integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==", "license": "MIT" }, + "node_modules/debug": { + "version": "4.3.7", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz", + "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==", + "dependencies": { + "ms": "^2.1.3" + }, + "engines": { + "node": ">=6.0" + }, + "peerDependenciesMeta": { + "supports-color": { + "optional": true + } + } + }, "node_modules/delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -1878,6 +1908,26 @@ "vue": "^3.2.0" } }, + "node_modules/engine.io-client": { + "version": "6.6.3", + "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.6.3.tgz", + "integrity": "sha512-T0iLjnyNWahNyv/lcjS2y4oE358tVS/SYQNxYXGAJ9/GLgH4VCvOQ/mhTjqU88mLZCQgiG8RIegFHYCdVC+j5w==", + "dependencies": { + "@socket.io/component-emitter": "~3.1.0", + "debug": "~4.3.1", + "engine.io-parser": "~5.2.1", + "ws": "~8.17.1", + "xmlhttprequest-ssl": "~2.1.1" + } + }, + "node_modules/engine.io-parser": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.3.tgz", + "integrity": "sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/entities": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz", @@ -2456,6 +2506,11 @@ "node": ">= 0.6" } }, + "node_modules/ms": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==" + }, "node_modules/namespace-emitter": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/namespace-emitter/-/namespace-emitter-2.0.1.tgz", @@ -2735,6 +2790,32 @@ "node": ">=12.17.0" } }, + "node_modules/socket.io-client": { + "version": "4.8.1", + "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.8.1.tgz", + "integrity": "sha512-hJVXfu3E28NmzGk8o1sHhN3om52tRvwYeidbj7xKy2eIIse5IoKX3USlS6Tqt3BHAtflLIkCQBkzVrEEfWUyYQ==", + "dependencies": { + "@socket.io/component-emitter": "~3.1.0", + "debug": "~4.3.2", + "engine.io-client": "~6.6.1", + "socket.io-parser": "~4.2.4" + }, + "engines": { + "node": ">=10.0.0" + } + }, + "node_modules/socket.io-parser": { + "version": "4.2.4", + "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz", + "integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==", + "dependencies": { + "@socket.io/component-emitter": "~3.1.0", + "debug": "~4.3.1" + }, + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/source-map-js": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", @@ -2998,6 +3079,34 @@ "integrity": "sha512-DXukZJxpHA8LuotRwL0pP1+rS6CS7FF2qStDDE1C7DDg2rLud2PXRMuEDYIPhgEezwnlHNL4c+N6MfMTjCGTng==", "license": "MIT" }, + "node_modules/ws": { + "version": "8.17.1", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.1.tgz", + "integrity": "sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==", + "engines": { + "node": ">=10.0.0" + }, + "peerDependencies": { + "bufferutil": "^4.0.1", + "utf-8-validate": ">=5.0.2" + }, + "peerDependenciesMeta": { + "bufferutil": { + "optional": true + }, + "utf-8-validate": { + "optional": true + } + } + }, + "node_modules/xmlhttprequest-ssl": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.1.2.tgz", + "integrity": "sha512-TEU+nJVUUnA4CYJFLvK5X9AOeH4KvDvhIfm0vV1GaQRtchnG0hgK5p8hw/xjv8cunWYCsiPCSDzObPyhEwq3KQ==", + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/zrender": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/zrender/-/zrender-5.6.1.tgz", diff --git a/package.json b/package.json index 823c700..23df0ee 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ }, "dependencies": { "@element-plus/icons-vue": "^2.3.1", + "@types/socket.io-client": "^3.0.0", "@wangeditor/editor": "^5.1.23", "@wangeditor/editor-for-vue": "^5.1.12", "axios": "^1.6.2", @@ -17,6 +18,7 @@ "element-plus": "^2.4.4", "nprogress": "^0.2.0", "pinia": "^2.1.7", + "socket.io-client": "^4.8.1", "vue": "^3.3.11", "vue-echarts": "^6.6.1", "vue-router": "^4.2.5" diff --git a/src/api/group.js b/src/api/group.js new file mode 100644 index 0000000..697eedf --- /dev/null +++ b/src/api/group.js @@ -0,0 +1,11 @@ +import {groupRequest} from "@/utils/api"; + +// 群聊相关API +export const groupAPI = { + // 登录 + list: (params) => groupRequest.get('/group/list', {params}) +} + +export default { + groupAPI +} diff --git a/src/api/message.js b/src/api/message.js new file mode 100644 index 0000000..6fcdd5c --- /dev/null +++ b/src/api/message.js @@ -0,0 +1,12 @@ +import {groupRequest, messageRequest} from "@/utils/api"; + +// 群聊相关API +export const messageAPI = { + // 登录 + list: (params) => messageRequest.get('/message/list', {params}), + read: (data) => groupRequest.post('/message/read', data), +} + +export default { + messageAPI +} diff --git a/src/assets/svg/chat.svg b/src/assets/svg/chat.svg new file mode 100644 index 0000000..5625c6a --- /dev/null +++ b/src/assets/svg/chat.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/svg/inChat.svg b/src/assets/svg/inChat.svg new file mode 100644 index 0000000..81f6e3c --- /dev/null +++ b/src/assets/svg/inChat.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/RichTextEditor.vue b/src/components/RichTextEditor.vue index 40d4f26..5affc38 100644 --- a/src/components/RichTextEditor.vue +++ b/src/components/RichTextEditor.vue @@ -7,7 +7,8 @@ :mode="mode" /> + + + + + - + @@ -193,6 +198,7 @@ import { useRoute, useRouter } from 'vue-router' import { useUserStore } from '@/stores/user' import { ElMessage, ElMessageBox } from 'element-plus' import ProgramSvg from '@/assets/svg/program.svg' +import ChatSvg from '@/assets/svg/chat.svg' import { Odometer, User, diff --git a/src/router/index.js b/src/router/index.js index fd075c3..653a25e 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -107,6 +107,15 @@ const routes = [ title: '项目管理 - 炬融圈', icon: 'Project' } + }, + { + path: 'chat', + name: 'Chat', + component: () => import('@/views/Chat.vue'), + meta: { + title: '聊天 - 炬融圈', + icon: 'ChatDotRound' + } } ] }, diff --git a/src/utils/api.js b/src/utils/api.js index 450ca45..65b5b31 100644 --- a/src/utils/api.js +++ b/src/utils/api.js @@ -137,6 +137,8 @@ export const createRequest = (baseURL) => { export const apiRequest = createRequest(import.meta.env.VITE_API_BASE_URL || '/api') export const midRequest = createRequest(import.meta.env.VITE_UPLOAD_BASE_URL || '/mid') export const programRequest = createRequest(import.meta.env.VITE_UPLOAD_BASE_URL || '/program') +export const groupRequest = createRequest(import.meta.env.VITE_UPLOAD_BASE_URL || '/group') +export const messageRequest = createRequest(import.meta.env.VITE_UPLOAD_BASE_URL || '/message') let loadingInstance = null let requestCount = 0 diff --git a/src/views/Chat.vue b/src/views/Chat.vue new file mode 100644 index 0000000..0db7d76 --- /dev/null +++ b/src/views/Chat.vue @@ -0,0 +1,976 @@ + + + + + \ No newline at end of file diff --git a/src/views/Program.vue b/src/views/Program.vue index 7b43034..321e0af 100644 --- a/src/views/Program.vue +++ b/src/views/Program.vue @@ -166,7 +166,7 @@ - + @@ -195,8 +195,8 @@ - - + + -