diff --git a/im-platform/src/main/java/com/bx/implatform/util/MinioUtil.java b/im-platform/src/main/java/com/bx/implatform/util/MinioUtil.java index f10cfee..911d940 100644 --- a/im-platform/src/main/java/com/bx/implatform/util/MinioUtil.java +++ b/im-platform/src/main/java/com/bx/implatform/util/MinioUtil.java @@ -106,7 +106,10 @@ public class MinioUtil { if (StringUtils.isBlank(originalFilename)){ throw new RuntimeException(); } - String fileName = System.currentTimeMillis() + originalFilename.substring(originalFilename.lastIndexOf(".")); + String fileName = System.currentTimeMillis()+""; + if(originalFilename.lastIndexOf(".") >= 0){ + fileName +=originalFilename.substring(originalFilename.lastIndexOf(".")); + } String objectName = DateTimeUtils.getFormatDate(new Date(),DateTimeUtils.PARTDATEFORMAT)+ "/" + fileName; try { PutObjectArgs objectArgs = PutObjectArgs.builder().bucket(bucketName).object(path+"/" +objectName) diff --git a/im-ui/src/components/chat/ChatBox.vue b/im-ui/src/components/chat/ChatBox.vue index fe5b806..c49de90 100644 --- a/im-ui/src/components/chat/ChatBox.vue +++ b/im-ui/src/components/chat/ChatBox.vue @@ -2,7 +2,8 @@ {{title}} - + @@ -11,8 +12,9 @@
  • - +
@@ -20,31 +22,44 @@
-
+
- +
- +
-
+
- -
- 发送 +
+ + +
+
+ + +
+
+
+ 发送 +
@@ -56,7 +71,8 @@ - + @@ -89,6 +105,8 @@ group: {}, groupMembers: [], sendText: "", + sendImageUrl: "", + sendImageFile: "", showVoice: false, // 是否显示语音录制弹窗 showSide: false, // 是否显示群聊信息栏 showEmotion: false, // 是否显示emoji表情 @@ -101,9 +119,29 @@ } }, methods: { - handleImageSuccess(res, file) { - let msgInfo = JSON.parse(JSON.stringify(file.raw.msgInfo)); - msgInfo.content = JSON.stringify(res.data); + handlePaste(e) { + let txt = event.clipboardData.getData('Text') + if (typeof(txt) == 'string') { + this.sendText += txt + } + const items = (event.clipboardData || window.clipboardData).items + if (items.length) { + for (let i = 0; i < items.length; i++) { + if (items[i].type.indexOf('image') !== -1) { + let file = items[i].getAsFile(); + this.sendImageFile = file; + this.sendImageUrl = URL.createObjectURL(file); + } + } + } + }, + removeSendImage() { + this.sendImageUrl = ""; + this.sendImageFile = null; + }, + handleImageSuccess(data, file) { + let msgInfo = JSON.parse(JSON.stringify(file.msgInfo || file.raw.msgInfo)); + msgInfo.content = JSON.stringify(data); this.$http({ url: this.messageAction, method: 'post', @@ -114,8 +152,8 @@ this.$store.commit("insertMessage", msgInfo); }) }, - handleImageFail(res, file) { - let msgInfo = JSON.parse(JSON.stringify(file.raw.msgInfo)); + handleImageFail(e, file) { + let msgInfo = JSON.parse(JSON.stringify(file.msgInfo || file.raw.msgInfo)); msgInfo.loadStatus = 'fail'; this.$store.commit("insertMessage", msgInfo); }, @@ -144,11 +182,11 @@ // 借助file对象保存 file.msgInfo = msgInfo; }, - handleFileSuccess(res, file) { + handleFileSuccess(url, file) { let data = { name: file.name, size: file.size, - url: res.data + url: url } let msgInfo = JSON.parse(JSON.stringify(file.raw.msgInfo)); msgInfo.content = JSON.stringify(data); @@ -162,7 +200,8 @@ this.$store.commit("insertMessage", msgInfo); }) }, - handleFileFail(res, file) { + handleFileFail(e, file) { + let msgInfo = JSON.parse(JSON.stringify(file.raw.msgInfo)); msgInfo.loadStatus = 'fail'; this.$store.commit("insertMessage", msgInfo); @@ -261,6 +300,30 @@ msgInfo.recvId = targetId; } }, + handleSendMessage() { + if (this.sendImageFile) { + this.sendImageMessage(); + } else { + this.sendTextMessage(); + } + }, + sendImageMessage() { + this.handleImageBefore(this.sendImageFile); + let formData = new FormData() + formData.append('file', this.sendImageFile.raw || this.sendImageFile) + this.$http.post("/image/upload", formData, { + headers: { + 'Content-Type': 'multipart/form-data' + } + }).then((data) => { + this.handleImageSuccess(data, this.sendImageFile); + }).catch((res) => { + this.handleImageSuccess(res, this.sendImageFile); + }).finally(() => { + this.sendImageFile = null; + this.sendImageUrl= "" + }); + }, sendTextMessage() { if (!this.sendText.trim()) { this.$message.error("不能发送空白信息"); @@ -498,22 +561,67 @@ } } - .send-text-area { - box-sizing: border-box; - padding: 5px; - width: 100%; - flex: 1; - resize: none; - font-size: 16px; - color: black; + .send-content-area { + display: flex; + flex-direction: column; + height: 100%; background-color: #f8f8f8 !important; outline-color: rgba(83, 160, 231, 0.61); - } - .im-chat-send { - text-align: right; - padding: 7px; + .send-text-area { + box-sizing: border-box; + padding: 5px; + width: 100%; + flex: 1; + resize: none; + font-size: 16px; + color: black; + background-color: #f8f8f8 !important; + outline-color: rgba(83, 160, 231, 0.61); + text-align: left; + border: 0; + } + + .send-image-area { + text-align: left; + + .send-image-box { + position: relative; + display: inline-block; + + .send-image { + max-height: 190px; + border: 1px solid #ccc; + border-radius: 2%; + margin: 2px; + } + + .send-image-close { + position: absolute; + padding: 3px; + right: 7px; + top: 7px; + color: white; + cursor: pointer; + font-size: 15px; + font-weight: 600; + background-color: #aaa; + border-radius: 50%; + border: 1px solid #ccc; + } + } + + } + + .send-btn-area { + + padding: 10px; + position: absolute; + bottom: 0; + right: 0; + } } + } .chat-group-side-box { @@ -521,4 +629,4 @@ animation: rtl-drawer-in .3s 1ms; } } - + \ No newline at end of file diff --git a/im-ui/src/components/chat/ChatMessageItem.vue b/im-ui/src/components/chat/ChatMessageItem.vue index 58a0f6e..45d89b3 100644 --- a/im-ui/src/components/chat/ChatMessageItem.vue +++ b/im-ui/src/components/chat/ChatMessageItem.vue @@ -21,7 +21,7 @@
-