From b48a5f64fe196bee6f1c7eb0be1b78c9ebec0860 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 11 Oct 2021 08:44:27 +0800
Subject: [PATCH] 修改完善
---
pages/groupChat/chating.vue | 125 +++++++++++++++++++++++++++++++----------
1 files changed, 94 insertions(+), 31 deletions(-)
diff --git a/pages/groupChat/chating.vue b/pages/groupChat/chating.vue
index 922af94..8c8f014 100644
--- a/pages/groupChat/chating.vue
+++ b/pages/groupChat/chating.vue
@@ -1,19 +1,20 @@
<template>
<view class="container">
-
+
<!-- 头部 -->
- <u-navbar style="position: relative;" :is-fixed="false" :border-bottom="true" :is-back="true"
- :title="recName" back-icon-color="#fff" :background="{ background: '#0BB9C8' }" title-color="#fff">
+ <u-navbar style="position: relative;" :is-fixed="false" :border-bottom="true" :is-back="true" :title="recName"
+ back-icon-color="#fff" :background="{ background: '#0BB9C8' }" title-color="#fff">
<view slot='right'>
- <u-icon @click="chatMessageDetail" class="set-icon" name="more-dot-fill" color="#fff" size="28"></u-icon>
+ <u-icon @click="chatMessageDetail" class="set-icon" name="more-dot-fill" color="#fff" size="28">
+ </u-icon>
</view>
</u-navbar>
- <scroll-view id="chatingBox" :style="{ height: swiperHeight + 'px' }" scroll-y="true" class="chat" scroll-with-animation="isanimation" :scroll-into-view="scrollToView"
- @scrolltoupper="nextPage">
+ <scroll-view id="chatingBox" :style="{ height: swiperHeight + 'px' }" scroll-y="true" class="chat"
+ scroll-with-animation="isanimation" :scroll-into-view="scrollToView" @scrolltoupper="nextPage">
<view class="chat-main" :style="{paddingBottom:inputh + 'px'}">
<view class="loading" :class="{displaynone:isload}">
<image src="@/static/images/chatroom/load.png" mode="" class="loading-img"
@@ -35,10 +36,12 @@
</view>
<!-- voice -->
<view class="message" v-if="item.messageType == 2">
- <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 'px'}"
- @tap="playVoice(item.postMessage.voice)">
+ <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 50 + 'px'}"
+ @tap="playVoice(item.postMessage)">
+
<image src="../../static/images/chatroom/sound.png" mode="" class="voice-img" />
- {{ item.postMessage.time }} "
+ {{ item.postMessage.time }}"
+
</view>
</view>
<!-- location -->
@@ -63,9 +66,9 @@
</view>
<!-- voice -->
<view class="message" v-if="item.messageType == 2">
- <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 'px'}"
- @tap="playVoice(item.postMessage.voice)">
- {{ item.postMessage.time }} "
+ <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 50 + 'px'}"
+ @tap="playVoice(item.postMessage)">
+ {{ item.postMessage.time }}"
<image src="@/static/images/chatroom/sound.png" mode="" class="voice-img" />
</view>
</view>
@@ -98,7 +101,7 @@
import filter from '@/config/filter.js'
import submit from '@/components/submit/submit.vue'
import WxStorage from "../../static/lib/wxStorage.js"
- const innerAudioContext = uni.createInnerAudioContext()
+
export default {
data() {
@@ -122,7 +125,8 @@
isanimation: true,
begainloading: true,
- name: [] //视频 双方id
+ name: [], //视频 双方id
+ innerAudioContext: uni.createInnerAudioContext()
};
},
components: {
@@ -132,7 +136,13 @@
this.recipientId = option.chatID;
this._getMsg(this.nowpage)
// this.nextPage()
- var data = JSON.parse(option.data)
+ var data = option.data
+
+ if (this.isJSON(option.data) == true) {
+ data = JSON.parse(option.data)
+ }
+
+
console.log(data, 55555555555555555555555)
this.name = ['wo', option.chatID];
// console.log(data)
@@ -141,13 +151,14 @@
} else {
this.callName = data.recipientName;
}
+
},
-
+
onReady() {
let that = this;
uni.getSystemInfo({
success(e) {
- console.log(e);
+ // console.log(e);
let {
windowWidth,
windowHeight,
@@ -157,22 +168,27 @@
query
.select('#chatingBox')
.boundingClientRect(data => {
-
+
that.swiperHeight = (safeArea.bottom - data.top);
-
+
})
.exec();
}
});
},
-
+
methods: {
+ chatMessageDetail() {
+
+ },
+
// 返回键
backOne() {
uni.navigateBack({
delta: 1
})
},
+
// 滚动顶部加载上一页
nextPage() {
// if(this.nowpage > 0 && this.begainloading) {
@@ -221,7 +237,8 @@
var resdata = res.data.data.user;
for (var i = 0; i < resdata.length; i++) {
if (resdata[i].avatar == null || resdata[i].avatar == "") {
- resdata[i].avatar = "https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20191109%2F1d3d4d82715444c4b8284f65e3feed10.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1632484198&t=1f4086a5894cbf83b311fa37c276405c";
+ resdata[i].avatar =
+ "https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20191109%2F1d3d4d82715444c4b8284f65e3feed10.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1632484198&t=1f4086a5894cbf83b311fa37c276405c";
}
if (resdata[i].id == that.senId) {
@@ -259,6 +276,11 @@
msg[i].message = '../../static/images/index/friend-list/' + msg[i].message
that.imgMsg.unshift(msg[i].message)
}
+
+ if (that.isJSON(msg[i].postMessage) == true) {
+ msg[i].postMessage = JSON.parse(msg[i].postMessage)
+ }
+
that.msgs.unshift(msg[i])
}
@@ -280,6 +302,25 @@
})
},
+
+ isJSON(str) {
+
+ if (typeof str == 'string') {
+ try {
+ var obj = JSON.parse(str);
+ if (typeof obj == 'object' && obj) {
+ return true;
+ } else {
+ return false;
+ }
+
+ } catch (e) {
+ return false;
+ }
+ }
+
+ },
+
// 预览图片
previewImage(e) {
@@ -295,22 +336,33 @@
longPressActions: {
itemList: ['发送给朋友', '保存图片', '收藏'],
success: function(data) {
- console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
+ // console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
},
fail: function(err) {
- console.log(err.errMsg);
+ // console.log(err.errMsg);
}
}
});
},
// 音频播放
playVoice(e) {
- console.log('ok')
- innerAudioContext.src = e
+ console.log(e, 'ok')
+
+ var innerAudioContext = this.innerAudioContext = uni.createInnerAudioContext()
+ // innerAudioContext.autoplay = false
+ innerAudioContext.src = e.voice
innerAudioContext.play()
+
+ setTimeout(() => {
+ innerAudioContext.destroy()
+ }, e.time * 1000)
+
},
// 接收输入内容
inputs(e) {
+
+ console.log(e, 999)
+
var that = this;
this.isanimation = true
let len = this.msgs.length - 1
@@ -325,10 +377,19 @@
senderId: that.senId,
recipientId: that.recipientId,
postMessage: e.message,
- messageType: 0,
+ messageType: e.types,
status: 0,
postTime: nowTime,
}
+
+ var mesagess = null;
+
+ if (e.message instanceof Object) {
+ mesagess = JSON.stringify(e.message)
+ } else {
+ mesagess = e.message
+ }
+
uni.request({
url: this.$store.state.piAPI + "/chat-records/insertSingleChat",
@@ -336,12 +397,14 @@
data: {
senderId: that.senId,
recipientId: that.recipientId,
- postMessage: e.message,
- messageType: 0,
+ postMessage: mesagess,
+ messageType: e.types,
status: 0,
postTime: sentTime,
},
success: (res) => {
+
+ console.log(res, 89898)
}
});
@@ -389,7 +452,7 @@
name: e.name,
address: e.address,
success: () => {
- console.log('success')
+ // console.log('success')
}
})
},
@@ -437,7 +500,7 @@
height: auto;
margin-right: 35rpx;
}
-
+
.chat {
height: 100%;
@@ -492,7 +555,7 @@
font-size: $uni-font-size-lg;
color: $uni-text-color;
line-height: 44rpx;
- padding: 18rpx 34rpx;
+ padding: 18rpx 20rpx;
}
.msg-img {
--
Gitblit v1.9.3