Browse Source

1.弹出框支持拖拽

2.移动端tab按钮样式优化
3.修复web端发送多个文件的bug
master
xsx 11 months ago
parent
commit
164cad0b59
  1. 16
      im-uniapp/pages.json
  2. 0
      im-uniapp/static/tab/chat.png
  3. BIN
      im-uniapp/static/tab/chat_active.png
  4. 0
      im-uniapp/static/tab/friend.png
  5. BIN
      im-uniapp/static/tab/friend_active.png
  6. 0
      im-uniapp/static/tab/group.png
  7. BIN
      im-uniapp/static/tab/group_active.png
  8. BIN
      im-uniapp/static/tab/mine.png
  9. BIN
      im-uniapp/static/tab/mine_active.png
  10. BIN
      im-uniapp/static/tarbar/chat_active.png
  11. BIN
      im-uniapp/static/tarbar/friend_active.png
  12. BIN
      im-uniapp/static/tarbar/group_active.png
  13. BIN
      im-uniapp/static/tarbar/mine.png
  14. BIN
      im-uniapp/static/tarbar/mine_active.png
  15. 7
      im-web/src/components/chat/ChatBox.vue
  16. 8
      im-web/src/components/chat/ChatInput.vue
  17. 11
      im-web/src/components/chat/ChatItem.vue
  18. 2
      im-web/src/components/chat/ChatRecord.vue
  19. 2
      im-web/src/components/friend/AddFriend.vue
  20. 31
      im-web/src/components/group/AddGroupMember.vue
  21. 2
      im-web/src/components/group/GroupMemberSelector.vue
  22. 2
      im-web/src/components/rtc/RtcGroupJoin.vue
  23. 2
      im-web/src/components/setting/Setting.vue

16
im-uniapp/pages.json

@ -78,26 +78,26 @@
"backgroundColor": "#ffffff", "backgroundColor": "#ffffff",
"list": [{ "list": [{
"pagePath": "pages/chat/chat", "pagePath": "pages/chat/chat",
"iconPath": "static/tarbar/chat.png", "iconPath": "static/tab/chat.png",
"selectedIconPath": "static/tarbar/chat_active.png", "selectedIconPath": "static/tab/chat_active.png",
"text": "消息" "text": "消息"
}, },
{ {
"pagePath": "pages/friend/friend", "pagePath": "pages/friend/friend",
"iconPath": "static/tarbar/friend.png", "iconPath": "static/tab/friend.png",
"selectedIconPath": "static/tarbar/friend_active.png", "selectedIconPath": "static/tab/friend_active.png",
"text": "好友" "text": "好友"
}, },
{ {
"pagePath": "pages/group/group", "pagePath": "pages/group/group",
"iconPath": "static/tarbar/group.png", "iconPath": "static/tab/group.png",
"selectedIconPath": "static/tarbar/group_active.png", "selectedIconPath": "static/tab/group_active.png",
"text": "群聊" "text": "群聊"
}, },
{ {
"pagePath": "pages/mine/mine", "pagePath": "pages/mine/mine",
"iconPath": "static/tarbar/mine.png", "iconPath": "static/tab/mine.png",
"selectedIconPath": "static/tarbar/mine_active.png", "selectedIconPath": "static/tab/mine_active.png",
"text": "我的" "text": "我的"
} }
] ]

0
im-uniapp/static/tarbar/chat.png → im-uniapp/static/tab/chat.png

Before

Width:  |  Height:  |  Size: 6.2 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
im-uniapp/static/tab/chat_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

0
im-uniapp/static/tarbar/friend.png → im-uniapp/static/tab/friend.png

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
im-uniapp/static/tab/friend_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

0
im-uniapp/static/tarbar/group.png → im-uniapp/static/tab/group.png

Before

Width:  |  Height:  |  Size: 6.7 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

BIN
im-uniapp/static/tab/group_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
im-uniapp/static/tab/mine.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
im-uniapp/static/tab/mine_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

BIN
im-uniapp/static/tarbar/chat_active.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

BIN
im-uniapp/static/tarbar/friend_active.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.0 KiB

BIN
im-uniapp/static/tarbar/group_active.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.7 KiB

BIN
im-uniapp/static/tarbar/mine.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.1 KiB

BIN
im-uniapp/static/tarbar/mine_active.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.4 KiB

7
im-web/src/components/chat/ChatBox.vue

@ -399,9 +399,7 @@ export default {
return; return;
} }
let sendText = this.isReceipt ? "【回执消息】" : ""; let sendText = this.isReceipt ? "【回执消息】" : "";
let promiseList = []; fullList.forEach(async msg => {
for (let i = 0; i < fullList.length; i++) {
let msg = fullList[i];
switch (msg.type) { switch (msg.type) {
case "text": case "text":
await this.sendTextMessage(sendText + msg.content, msg.atUserIds); await this.sendTextMessage(sendText + msg.content, msg.atUserIds);
@ -413,8 +411,7 @@ export default {
await this.sendFileMessage(msg.content.file); await this.sendFileMessage(msg.content.file);
break; break;
} }
})
}
}, },
sendImageMessage(file) { sendImageMessage(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {

8
im-web/src/components/chat/ChatInput.vue

@ -1,8 +1,9 @@
<template> <template>
<div class="chat-input-area"> <div class="chat-input-area">
<div :class="['edit-chat-container', isEmpty ? '' : 'not-empty']" contenteditable="true" @paste.prevent="onPaste" <div :class="['edit-chat-container', isEmpty ? '' : 'not-empty']" contenteditable="true"
@keydown="onKeydown" @compositionstart="compositionFlag = true" @compositionend="onCompositionEnd" @paste.prevent="onPaste" @keydown="onKeydown" @compositionstart="compositionFlag = true"
@input="onEditorInput" @mousedown="onMousedown" ref="content" @blur="onBlur"> @compositionend="onCompositionEnd" @input="onEditorInput" @mousedown="onMousedown" ref="content"
@blur="onBlur">
</div> </div>
<chat-at-box @select="onAtSelect" :search-text="atSearchText" ref="atBox" :ownerId="ownerId" <chat-at-box @select="onAtSelect" :search-text="atSearchText" ref="atBox" :ownerId="ownerId"
:members="groupMembers"></chat-at-box> :members="groupMembers"></chat-at-box>
@ -342,6 +343,7 @@ export default {
this.empty(); this.empty();
this.imageList = []; this.imageList = [];
this.fileList = []; this.fileList = [];
this.$refs.atBox.close();
}, },
empty() { empty() {
this.$refs.content.innerHTML = ""; this.$refs.content.innerHTML = "";

11
im-web/src/components/chat/ChatItem.vue

@ -9,7 +9,7 @@
<div class="chat-name"> <div class="chat-name">
<div class="chat-name-text"> <div class="chat-name-text">
<div>{{ chat.showName }}</div> <div>{{ chat.showName }}</div>
<el-tag v-if="chat.type == 'GROUP'" size="mini" effect="dark"></el-tag> <el-tag v-if="chat.type == 'GROUP'" size="mini" ></el-tag>
</div> </div>
<div class="chat-time-text">{{ showTime }}</div> <div class="chat-time-text">{{ showTime }}</div>
</div> </div>
@ -53,9 +53,6 @@ export default {
}, },
active: { active: {
type: Boolean type: Boolean
},
index: {
type: Number
} }
}, },
methods: { methods: {
@ -159,15 +156,9 @@ export default {
.el-tag { .el-tag {
min-width: 22px; min-width: 22px;
text-align: center; text-align: center;
background-color: #2830d3;
border-radius: 10px; border-radius: 10px;
border: 0; border: 0;
height: 16px; height: 16px;
line-height: 16px;
font-size: 10px;
margin-left: 2px;
opacity: 0.8;
} }
} }

2
im-web/src/components/chat/ChatRecord.vue

@ -1,5 +1,5 @@
<template> <template>
<el-dialog class="chat-record" title="语音录制" :visible.sync="visible" width="600px" :before-close="onClose"> <el-dialog v-dialogDrag class="chat-record" title="语音录制" :visible.sync="visible" width="600px" :before-close="onClose">
<div v-show="mode == 'RECORD'"> <div v-show="mode == 'RECORD'">
<div class="tip">{{ stateTip }}</div> <div class="tip">{{ stateTip }}</div>
<div>时长: {{ state == 'STOP' ? 0 : parseInt(rc.duration) }}s</div> <div>时长: {{ state == 'STOP' ? 0 : parseInt(rc.duration) }}s</div>

2
im-web/src/components/friend/AddFriend.vue

@ -1,5 +1,5 @@
<template> <template>
<el-dialog title="添加好友" :visible.sync="dialogVisible" width="400px" :before-close="onClose" <el-dialog v-dialogDrag title="添加好友" :visible.sync="dialogVisible" width="400px" :before-close="onClose"
custom-class="add-friend-dialog"> custom-class="add-friend-dialog">
<el-input placeholder="输入用户名或昵称按下enter搜索,最多展示20条" class="input-with-select" v-model="searchText" size="small" <el-input placeholder="输入用户名或昵称按下enter搜索,最多展示20条" class="input-with-select" v-model="searchText" size="small"
@keyup.enter.native="onSearch()"> @keyup.enter.native="onSearch()">

31
im-web/src/components/group/AddGroupMember.vue

@ -1,7 +1,7 @@
<template> <template>
<el-dialog title="邀请好友" :visible.sync="show" width="620px" :before-close="close"> <el-dialog v-dialogDrag title="邀请好友" :visible.sync="show" width="620px" :before-close="close">
<div class="agm-container"> <div class="add-group-member">
<div class="agm-l-box"> <div class="left-box">
<div class="search"> <div class="search">
<el-input placeholder="搜索好友" v-model="searchText" size="small"> <el-input placeholder="搜索好友" v-model="searchText" size="small">
<i class="el-icon-search el-input__icon" slot="suffix"> </i> <i class="el-icon-search el-input__icon" slot="suffix"> </i>
@ -11,15 +11,15 @@
<div v-for="friend in friends" :key="friend.id"> <div v-for="friend in friends" :key="friend.id">
<friend-item v-show="friend.nickName.includes(searchText)" :showDelete="false" <friend-item v-show="friend.nickName.includes(searchText)" :showDelete="false"
@click.native="onSwitchCheck(friend)" :menu="false" :friend="friend" :active="false"> @click.native="onSwitchCheck(friend)" :menu="false" :friend="friend" :active="false">
<el-checkbox :disabled="friend.disabled" @click.native.stop="" class="agm-friend-checkbox" <el-checkbox :disabled="friend.disabled" @click.native.stop="" class="friend-checkbox"
v-model="friend.isCheck" size="medium"></el-checkbox> v-model="friend.isCheck" size="medium"></el-checkbox>
</friend-item> </friend-item>
</div> </div>
</el-scrollbar> </el-scrollbar>
</div> </div>
<div class="agm-arrow el-icon-d-arrow-right"></div> <div class="arrow el-icon-d-arrow-right"></div>
<div class="agm-r-box"> <div class="right-box">
<div class="agm-select-tip"> 已勾选{{ checkCount }}位好友</div> <div class="tip"> 已勾选{{ checkCount }}位好友</div>
<el-scrollbar style="height:400px;"> <el-scrollbar style="height:400px;">
<div v-for="friend in friends" :key="friend.id"> <div v-for="friend in friends" :key="friend.id">
<friend-item v-if="friend.isCheck && !friend.disabled" :friend="friend" :active="false" <friend-item v-if="friend.isCheck && !friend.disabled" :friend="friend" :active="false"
@ -123,11 +123,11 @@ export default {
} }
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
.agm-container { .add-group-member {
display: flex; display: flex;
.agm-l-box { .left-box {
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;
border: var(--im-border); border: var(--im-border);
@ -141,15 +141,14 @@ export default {
border: unset; border: unset;
border-bottom: var(--im-border); border-bottom: var(--im-border);
} }
} }
.agm-friend-checkbox { .friend-checkbox {
margin-right: 20px; margin-right: 20px;
} }
} }
.agm-arrow { .arrow {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 18px; font-size: 18px;
@ -158,15 +157,15 @@ export default {
color: var(--im-color-primary); color: var(--im-color-primary);
} }
.agm-r-box { .right-box {
flex: 1; flex: 1;
border: var(--im-border); border: var(--im-border);
.agm-select-tip { .tip {
text-align: left; text-align: left;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
text-indent: 6px; text-indent: 10px;
color: var(--im-text-color-light) color: var(--im-text-color-light)
} }
} }

2
im-web/src/components/group/GroupMemberSelector.vue

@ -1,5 +1,5 @@
<template> <template>
<el-dialog :title="title" :visible.sync="isShow" width="700px"> <el-dialog v-dialogDrag :title="title" :visible.sync="isShow" width="700px">
<div class="group-member-selector"> <div class="group-member-selector">
<div class="left-box"> <div class="left-box">
<el-input placeholder="搜索" v-model="searchText"> <el-input placeholder="搜索" v-model="searchText">

2
im-web/src/components/rtc/RtcGroupJoin.vue

@ -1,5 +1,5 @@
<template> <template>
<el-dialog title="是否加入通话?" :visible.sync="isShow" width="400px"> <el-dialog v-dialogDrag title="是否加入通话?" :visible.sync="isShow" width="400px">
<div class="rtc-group-join"> <div class="rtc-group-join">
<div class="host-info"> <div class="host-info">
<head-image :name="rtcInfo.host.nickName" :url="rtcInfo.host.headImage" :size="80"></head-image> <head-image :name="rtcInfo.host.nickName" :url="rtcInfo.host.headImage" :size="80"></head-image>

2
im-web/src/components/setting/Setting.vue

@ -1,5 +1,5 @@
<template> <template>
<el-dialog class="setting" title="设置" :visible.sync="visible" width="420px" :before-close="onClose"> <el-dialog v-dialogDrag class="setting" title="设置" :visible.sync="visible" width="420px" :before-close="onClose">
<el-form :model="userInfo" label-width="80px" :rules="rules" ref="settingForm" size="small"> <el-form :model="userInfo" label-width="80px" :rules="rules" ref="settingForm" size="small">
<el-form-item label="头像" style="margin-bottom: 0 !important;"> <el-form-item label="头像" style="margin-bottom: 0 !important;">
<file-upload class="avatar-uploader" :action="imageAction" :showLoading="true" :maxSize="maxSize" <file-upload class="avatar-uploader" :action="imageAction" :showLoading="true" :maxSize="maxSize"

Loading…
Cancel
Save