-
-
- 发送
-
-
-
- {{ sendModeLabel }}
-
-
-
- Enter发送
- Ctrl+Enter发送
+
-
{
+ this.initQuill();
+ });
+ // 挂载全局键盘监听
+ document.addEventListener("keydown", this.handleGlobalKeydown);
},
beforeDestroy() {
- this.quill = null;
+ if (this.quill) {
+ this.quill = null;
+ }
+ // 移除全局监听（必加，避免多组件冲突）
+ document.removeEventListener("keydown", this.handleGlobalKeydown);
},
methods: {
// 初始化Quill
initQuill() {
const editorDom = this.$refs.quillEditor;
+ if (!editorDom) {
+ console.warn("Quill container not found, retrying...");
+ setTimeout(() => {
+ this.initQuill();
+ }, 100);
+ return;
+ }
+
+ // 防止重复初始化
+ if (this.quill) {
+ return;
+ }
+
this.quill = new Quill(editorDom, {
theme: "snow",
placeholder: "请输入消息...",
@@ -217,17 +238,26 @@ export default {
this.currentRange = range;
});
+ // 监听文本变化，检测@符号输入
+ this.quill.on("text-change", (delta, oldDelta, source) => {
+ if (source === "user") {
+ this.handleTextChange(delta);
+ }
+ });
+
// 粘贴图片
this.quill.root.addEventListener("paste", this.handlePaste, true);
// 回车发送逻辑
this.quill.root.addEventListener("keydown", (e) => {
if (this.sendMode === "enter") {
- if (e.key === "Enter" && !e.ctrlKey && !e.shiftKey) {
+ // Enter发送模式：Enter发送，Ctrl+Enter换行
+ if (e.key === "Enter" && !e.ctrlKey && !e.metaKey) {
e.preventDefault();
this.handleSendText();
}
} else {
+ // Ctrl+Enter发送模式：Ctrl+Enter发送，Enter换行
if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
e.preventDefault();
this.handleSendText();
@@ -235,6 +265,59 @@ export default {
}
});
},
+ handleGlobalKeydown(e) {
+ // 条件：Ctrl+Enter / Command+Enter（Mac）发送
+ if ((e.ctrlKey || e.metaKey) && e.key === "Enter") {
+ // 排除弹窗、输入框、下拉等场景误触发
+ const tag = document.activeElement.tagName;
+ if (["INPUT", "TEXTAREA", "SELECT"].includes(tag)) return;
+
+ // 无内容 / 发送中 不执行
+ const text = this.quill ? this.quill.getText().trim() : "";
+ if (!text || this.sending) return;
+
+ e.preventDefault();
+ this.handleSendText();
+ }
+ },
+
+ // 处理文本变化，检测@符号输入
+ handleTextChange(delta) {
+ try {
+ if (
+ !this.currentChat ||
+ this.currentChat.scene !== ContactsScene.GROUP
+ ) {
+ return;
+ }
+ if (!this.groupInfo) return;
+
+ if (delta.ops) {
+ delta.ops.forEach((op) => {
+ if (op.insert && typeof op.insert === "string") {
+ const atIndex = op.insert.lastIndexOf("@");
+ if (atIndex !== -1 && atIndex === op.insert.length - 1) {
+ this.showAtDropdown();
+ }
+ }
+ });
+ }
+ } catch (e) {
+ console.warn("handleTextChange error:", e);
+ }
+ },
+
+ // 显示@成员下拉框
+ showAtDropdown() {
+ try {
+ const dropdownEl = this.$refs.atDropdown;
+ if (dropdownEl && dropdownEl.$el) {
+ dropdownEl.$el.click();
+ }
+ } catch (e) {
+ console.warn("showAtDropdown error:", e);
+ }
+ },
clearEditor() {
if (this.quill) {
@@ -258,36 +341,79 @@ export default {
},
// 截屏
- handleScreenshotClick() {
- this.$emit("open-screenshot");
+ async handleScreenshotClick() {
+ try {
+ await takeScreenshot(
+ async (blob) => {
+ const fileName = `screenshot_${Date.now()}.png`;
+ const objectName = this.getObjectPath(fileName);
+
+ await this.ensureMinioInitialized();
+ const config = this.$store.getters.config;
+ const bucket = config.MINIO_BUCKET_FILE || "remote-file-test";
+
+ const result = await uploadFile(
+ bucket,
+ objectName,
+ blob,
+ {},
+ (percent) => {}
+ );
+
+ const uploadedPath = bucket + "/" + result.objectName;
+ this.insertImageToEditor(uploadedPath);
+ this.$message.success("截图已插入到编辑器");
+ },
+ () => {
+ this.$message.info("已取消截图");
+ }
+ );
+ } catch (e) {
+ this.$message.error("截图失败: " + e.message);
+ }
},
// ========== 核心：选中@成员 插入富文本 ==========
handleAtSelect(user) {
+ console.log(user);
+
if (!this.quill || !user) return;
- // 获取当前光标位置
const index = this.currentRange
? this.currentRange.index
: this.quill.getLength();
- // 拼接 @用户名 + 空格
const insertText = `@${user.name}`;
- // 插入文本到富文本
this.quill.insertText(index, insertText);
- // 光标移到插入内容后面
+ this.quill.formatText(index, insertText.length, {
+ color: "#409eff",
+ fontWeight: "500",
+ });
this.quill.setSelection(index + insertText.length);
- // 记录被@用户（去重）
const hasUser = this.selectedAtUsers.find((u) => u.id === user.id);
if (!hasUser) {
this.selectedAtUsers.push(user);
}
},
- handleTeachingClick() {
- this.$emit("open-teaching");
+ handleTeachingClick(meetingType) {
+ const targetMode = this.meetingModes.find(
+ (item) => item.type === meetingType
+ );
+ console.log(targetMode);
+ // 正常跳转
+ this.$router.push({
+ name: targetMode.routeName,
+ query: {
+ name: this.userInfo.group,
+ roomId_id: this.generateRoomId(targetMode.type, this.userInfo.id),
+ },
+ });
},
-
- handleConsultClick() {
- this.$emit("open-consult");
+ generateRoomId(meetingType, id) {
+ // 1. id固定3位，不足左侧补0
+ const idStr = String(id).padStart(3, "0");
+ // 拼接 = 会议类型 + 3位id + 前缀
+ const roomId = meetingType + idStr + this.config.MEETING_PREFIX;
+ return roomId;
},
// 提取@用户ID（发送接口使用）
@@ -305,21 +431,65 @@ export default {
async handleSendText() {
if (!this.quill || !this.currentChat) return;
const html = this.quill.root.innerHTML;
- const text = this.quill.getText().trim();
- if (!text) return;
+ const textContent = this.quill.getText().trim();
+
+ if (!textContent) return;
this.sending = true;
- const messageId = this.generateMessageId();
- const timestamp = Date.now();
try {
- const atUserIds = this.extractAtUsers(html);
+ const messages = this.parseEditorContent(html, textContent);
+
+ for (let i = 0; i < messages.length; i++) {
+ const messageData = messages[i];
+ const messageId = this.generateMessageId();
+
+ this.$emit("send-message", {
+ ...messageData,
+ is_self: true,
+ sending: true,
+ message_id: messageId,
+ });
+
+ const body = {
+ client_id: this.getClientId(),
+ message: messageData,
+ target_id: this.currentChat.id,
+ topic: this.getTopic(),
+ };
+
+ if (this.currentChat.scene === ContactsScene.PRIVATE) {
+ await sendPrivateMessage(body);
+ } else if (this.currentChat.scene === ContactsScene.GROUP) {
+ await sendMultiChatMessage(body);
+ }
+
+ this.$emit("update-message-status", messageId, { sending: false });
+ }
- const message = {
+ this.clearEditor();
+ this.selectedAtUsers = [];
+ } catch (e) {
+ this.$message.error("发送失败: " + (e.message || "未知错误"));
+ } finally {
+ this.sending = false;
+ }
+ },
+
+ // 解析编辑器内容，分离文本和图片
+ parseEditorContent(html, textContent) {
+ const messages = [];
+ const atUserIds = this.extractAtUsers(html);
+
+ const textOnly = textContent.replace(/\s+/g, "").length > 0;
+ const images = this.extractImagesFromEditor();
+
+ if (textOnly) {
+ messages.push({
at_users: atUserIds,
message_id: 0,
payload: {
- content: text,
+ content: textContent,
file_duration: 0,
file_ico: "",
file_name: "",
@@ -332,41 +502,56 @@ export default {
target_id: this.currentChat.id,
timestamp: 0,
type: "text",
- };
+ });
+ }
- const body = {
- client_id: this.getClientId(),
- message,
+ images.forEach((image) => {
+ messages.push({
+ at_users: [],
+ message_id: 0,
+ payload: {
+ content: "",
+ file_duration: 0,
+ file_ico: "",
+ file_name: image.fileName,
+ file_path: image.filePath,
+ file_size: image.fileSize || 0,
+ file_type: "image",
+ },
+ scene: this.currentChat.scene,
+ source_id: this.userInfo.id,
target_id: this.currentChat.id,
- topic: this.getTopic(),
- };
-
- this.$emit("send-message", {
- ...message,
- is_self: true,
- sending: true,
- message_id: messageId,
+ timestamp: 0,
+ type: "image",
});
+ });
- this.clearEditor();
- this.selectedAtUsers = [];
+ return messages;
+ },
- if (this.currentChat.scene === ContactsScene.PRIVATE) {
- await sendPrivateMessage(body);
- } else if (this.currentChat.scene === ContactsScene.GROUP) {
- await sendMultiChatMessage(body);
+ // 从编辑器中提取图片信息
+ extractImagesFromEditor() {
+ const images = [];
+ if (!this.quill) return images;
+
+ const config = this.$store.getters.config;
+ const endpoint = config.MINIO_ENDPOINT_HTTPS || "";
+ const bucket = config.MINIO_BUCKET_FILE || "remote-file-test";
+
+ this.quill.root.querySelectorAll("img").forEach((img) => {
+ const src = img.src;
+ if (src.startsWith(endpoint)) {
+ const filePath = src.replace(endpoint, "");
+ const fileName = filePath.split("/").pop();
+ images.push({
+ src: src,
+ filePath: filePath,
+ fileName: fileName,
+ });
}
+ });
- this.$emit("update-message-status", messageId, { sending: false });
- } catch (e) {
- this.$message.error("发送失败: " + (e.message || "未知错误"));
- this.$emit("update-message-status", messageId, {
- sending: false,
- sendFailed: true,
- });
- } finally {
- this.sending = false;
- }
+ return images;
},
// 文件相关逻辑
@@ -376,11 +561,43 @@ export default {
const file = files[0];
e.target.value = "";
+ if (!file.type.startsWith("image/")) {
+ this.$message.warning("只能上传图片文件");
+ return;
+ }
+
if (file.size > this.maxFileSize) {
this.$message.warning("文件大小不能超过100MB");
return;
}
- await this.sendFileMessage(file, type);
+
+ if (!this.currentChat) {
+ this.$message.warning("请先选择聊天对象");
+ return;
+ }
+
+ try {
+ await this.ensureMinioInitialized();
+ const fileName = file.name;
+ const objectName = this.getObjectPath(fileName);
+
+ const config = this.$store.getters.config;
+ const bucket = config.MINIO_BUCKET_FILE || "remote-file-test";
+
+ const result = await uploadFile(
+ bucket,
+ objectName,
+ file,
+ {},
+ (percent) => {}
+ );
+
+ const uploadedPath = bucket + "/" + result.objectName;
+ this.insertImageToEditor(uploadedPath);
+ this.$message.success("图片上传成功");
+ } catch (e) {
+ this.$message.error("图片上传失败: " + e.message);
+ }
},
async handlePaste(e) {
@@ -402,7 +619,8 @@ export default {
async sendFileMessage(file, type) {
if (!this.currentChat) return;
const messageId = this.generateMessageId();
- const fileName = this.generateFileName(file.name);
+ console.log("sendFileMessage", file);
+ const fileName = file.name;
const objectName = this.getObjectPath(fileName);
const fileType =
@@ -498,6 +716,26 @@ export default {
}
},
+ insertImageToEditor(imagePath) {
+ if (!this.quill) return;
+ const index = this.currentRange
+ ? this.currentRange.index
+ : this.quill.getLength();
+ const imageUrl =
+ this.$store.state.user.netConfig.MINIO_ENDPOINT_HTTPS + imagePath;
+ console.log(imageUrl);
+ this.quill.insertEmbed(index, "image", imageUrl);
+ this.quill.setSelection(index + 1);
+ },
+
+ ensureMinioInitialized() {
+ const config = this.$store.getters.config;
+ if (!config || !config.MINIO_ENDPOINT) {
+ return this.$store.dispatch("GetNetConfig");
+ }
+ return Promise.resolve();
+ },
+
async uploadToMinIO(file, objectName) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
@@ -536,19 +774,25 @@ export default {
);
},
- generateFileName(originalName) {
- const ext = originalName.split(".").pop();
- const timestamp = Date.now();
- const random = Math.random().toString(36).substr(2, 6);
- return `${timestamp}_${random}.${ext}`;
- },
-
getObjectPath(fileName) {
- const prefix =
- this.currentChat.scene === ContactsScene.GROUP
- ? MinioPaths.FILE_MULTICHAT
- : MinioPaths.FILE_PRIVATE;
- return prefix + fileName;
+ let sceneDir;
+ switch (this.currentChat.scene) {
+ case ContactsScene.GROUP:
+ sceneDir = MinioPaths.FILE_MULTICHAT;
+ break;
+ case ContactsScene.NOTIFY:
+ sceneDir = MinioPaths.FILE_SYSTEM_NOTIFY;
+ break;
+ case ContactsScene.PRIVATE:
+ sceneDir = MinioPaths.FILE_PRIVATE;
+ break;
+ default:
+ sceneDir = MinioPaths.FILE_PRIVATE;
+ break;
+ }
+ const sourceId = this.userInfo.id;
+ const targetId = this.currentChat.id;
+ return `${sceneDir}${sourceId}-${targetId}/${fileName}`;
},
getTopic() {
@@ -586,100 +830,52 @@ export default {
\ No newline at end of file
+
\ No newline at end of file
diff --git a/src/views/message/index.vue b/src/views/message/index.vue
index 7acbd39..751e6a9 100644
--- a/src/views/message/index.vue
+++ b/src/views/message/index.vue
@@ -16,6 +16,7 @@
@send-message="handleSendMessage"
@update-message-status="handleUpdateMessageStatus"
@font-size-change="handleFontSizeChange"
+ @refresh-list="handleRefreshList"
/>
@@ -25,7 +26,7 @@
ref="groupSettingRef"
:chat="currentChat"
:group-info="groupInfo"
- @quit-group="handleQuitGroup"
+ @quit-group="handleDismissGroup"
@dismiss-group="handleDismissGroup"
@refresh-list="handleRefreshList"
/>
@@ -286,7 +287,6 @@ export default {
this.$refs.messageList.removeContact(multiChatId, ContactsScene.GROUP);
}
},
-
// 群设置修改后刷新列表
handleRefreshList() {
if (this.$refs.messageList) {
@@ -325,9 +325,6 @@ export default {
},
handleSendMessage(message) {
- if (this.$refs.messageDisplay) {
- this.$refs.messageDisplay.addChatMessage(message);
- }
// 更新联系人列表
if (this.$refs.messageList) {
this.$refs.messageList.updateContactLastMessage(
@@ -337,6 +334,11 @@ export default {
new Date().toISOString()
);
}
+ if (this.$refs.messageDisplay) {
+ this.$refs.messageDisplay.addChatMessage(message);
+ }
+ // 刷新列表
+ this.$refs.messageList.refreshList({ selectFirst: true });
},
handleUpdateMessageStatus(messageId, updates) {
@@ -369,15 +371,6 @@ export default {
handleGroupSetting() {
this.$refs.groupSettingRef.loadGroupInfo();
},
-
- handleQuitGroup(chat) {
- // 退出群组逻辑
- if (this.$refs.messageList) {
- // 刷新列表并打开第一个
- this.$refs.messageList.refreshList({ selectFirst: true });
- }
- },
-
handleDismissGroup(chat) {
// 解散群组逻辑
if (this.$refs.messageList) {