徐强 / find_landlord · 提交

转到一个项目

作者 xuqiang
提交 ba253afea6e56910cf44b4dfc49de6d48cc849d4 1 个父辈 09f934c7

提交

内嵌 并排对比
正在显示 5 个修改的文件 包含 97 行增加 和 384 行删除
... ... @@ -64,15 +64,7 @@
}
}
},
mounted() {
uni.request({
url:this.apiUrl + '/gift/lis',
method:'POST',
success: (res) => {
this.giftList = res.data.data
this.showSendGift = true
}
})
onShow() {
uni.request({
url:apiUrl+'/wallet/index',
method:'POST',
... ... @@ -85,6 +77,16 @@
}
})
},
mounted() {
uni.request({
url:this.apiUrl + '/gift/lis',
method:'POST',
success: (res) => {
this.giftList = res.data.data
this.showSendGift = true
}
})
},
methods:{
//送出礼物
sendGift(){
... ... @@ -108,7 +110,7 @@
number:this.inpNum
}).then((res)=>{
if(res.code == 1){
this.$emit('closeSendGift')
this.$emit('closeSendGift',this.inpNum+this.giftList[this.giftIndex].name)
uni.showToast({
title:'送出礼物成功'
})
... ...
... ... @@ -45,22 +45,15 @@ Vue.prototype.$request=function(url,data='',type = 1){
data:data,
success:(res)=>{
// console.log('接口返回数据',res);
//token错误和返回结果都是用code
if(res.data.code==0){
if(res.data.code == 401){
uni.setStorageSync("token",'')
uni.reLaunch({
url:"/pages/index/login"
})
}
if(res.data.code==1){
if(res.data.code == 0 || res.data.code==1){
reslove(res.data)
}
if(res.data.code == 401){
uni.setStorageSync("token",'')
uni.reLaunch({
url:"/pages/index/login"
})
}
uni.hideLoading()
},
fail: (err) => {
... ...
... ... @@ -16,8 +16,15 @@
<view class="row" v-for="(item,index) in msgList" :key="index" :id="item.ID">
<!-- 用户消息 -->
<block>
<!-- 礼物消息 -->
<view class="system" v-if="item.flow == 'in' && item.type==TIM.TYPES.MSG_CUSTOM">
<!-- 发送礼物消息 -->
<view class="red-envelope">
{{item.payload.data}}
</view>
</view>
<!-- 自己发出的消息 -->
<view class="my" v-if="item.flow=='out'">
<view class="my" v-if="item.flow=='out' && item.type==TIM.TYPES.MSG_TEXT">
<!-- 左-消息 -->
<view class="left">
<view class="username">
... ... @@ -28,7 +35,7 @@
<view class="peerStatus">
{{item.isPeerRead ? '已读' : '未读'}}
</view>
<view v-if="item.type==TIM.TYPES.MSG_TEXT" class="bubble">
<view class="bubble">
<rich-text :nodes="nodesFliter(item.payload.text)"></rich-text>
</view>
</view>
... ... @@ -40,7 +47,7 @@
</view>
</view>
<!-- 别人发出的消息 -->
<view class="other" v-else>
<view class="other" v-if="item.flow=='in' && item.type==TIM.TYPES.MSG_TEXT">
<!-- 左-头像 -->
<navigator class="left" hover-class="none" :url="'/pages/index/landHome?id='+toUserInfo.id">
<image :src="toUserInfo.avatar" mode="aspectFill"></image>
... ... @@ -75,40 +82,13 @@
</view>
</swiper-item>
</swiper>
<!-- 更多功能 相册-拍照-红包 -->
<view class="more-layer" :class="{hidden:hideMore}">
<view class="list">
<view class="box" @tap="chooseImage">
<view class="icon tupian2"></view>
</view>
<view class="box" @tap="camera">
<view class="icon paizhao"></view>
</view>
<view class="box" @tap="handRedEnvelopes">
<view class="icon hongbao"></view>
</view>
</view>
</view>
</view>
<!-- 送礼物弹框 -->
<send-gift v-if="showSendGift" :toUserId="toUserInfo.id" @closeSendGift="showSendGift = false"></send-gift>
<send-gift v-if="showSendGift" :toUserId="toUserInfo.id" @closeSendGift="closeSendGift"></send-gift>
<!-- 底部输入栏 -->
<view class="input-box" :style="{bottom: keyboardHeight+'rpx'}" :class="popupLayerClass" @touchmove.stop.prevent="discard">
<!-- H5下不能录音，输入栏布局改动一下 -->
<!-- #ifndef H5 -->
<!-- <view class="voice">
<view class="icon" :class="isVoice?'jianpan':'yuyin'" @tap="switchVoice"></view>
</view> -->
<!-- #endif -->
<!-- #ifdef H5 -->
<!-- <view class="more" @tap="showMore">
<view class="icon add"></view>
</view> -->
<!-- #endif -->
<view class="textbox">
<view class="voice-mode" :class="[isVoice?'':'hidden',recording?'recording':'']" @touchstart="voiceBegin"
@touchmove.stop.prevent="voiceIng" @touchend="voiceEnd" @touchcancel="voiceCancel">{{voiceTis}}</view>
<view class="text-mode" :class="isVoice?'hidden':''">
<view class="text-mode">
<view class="box">
<textarea auto-height="true" v-model="textMsg" @focus="textareaFocus" />
</view>
... ... @@ -117,43 +97,10 @@
</view>
</view>
</view>
<!-- #ifndef H5 -->
<!-- <view class="more" @tap="showMore">
<view class="icon add"></view>
</view> -->
<!-- #endif -->
<view class="send" :class="isVoice?'hidden':''" @tap="sendText">
<view class="send" @tap="sendText">
<view class="btn">发送</view>
</view>
</view>
<!-- 录音UI效果 -->
<view class="record" :class="recording?'':'hidden'">
<view class="ing" :class="willStop?'hidden':''"><view class="icon luyin2" ></view></view>
<view class="cancel" :class="willStop?'':'hidden'"><view class="icon chehui" ></view></view>
<view class="tis" :class="willStop?'change':''">{{recordTis}}</view>
</view>
<!-- 红包弹窗 -->
<view class="windows" :class="windowsState">
<!-- 遮罩层 -->
<view class="mask" @touchmove.stop.prevent="discard" @tap="closeRedEnvelope"></view>
<view class="layer" @touchmove.stop.prevent="discard">
<view class="open-redenvelope">
<view class="top">
<view class="close-btn">
<view class="icon close" @tap="closeRedEnvelope"></view>
</view>
<image src="/static/img/im/face/face_1.jpg"></image>
</view>
<view class="from">来自{{redenvelopeData.from}}</view>
<view class="blessing">{{redenvelopeData.blessing}}</view>
<view class="money">{{redenvelopeData.money}}</view>
<view class="showDetails" @tap="toDetails(redenvelopeData.rid)">
查看领取详情 <view class="icon to"></view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
... ... @@ -179,35 +126,11 @@
isCompleted:'',
msgList:[],
TIM:null,
//文字消息
textMsg:'',
scrollAnimation:false,
scrollTop:0,
scrollToView:'',
msgImgList:[],
myuid:0,
//录音相关参数
// #ifndef H5
//H5不能录音
RECORDER:uni.getRecorderManager(),
// #endif
isVoice:false,
voiceTis:'按住 说话',
recordTis:"手指上滑 取消发送",
recording:false,
willStop:false,
initPoint:{identifier:0,Y:0},
recordTimer:null,
recordLength:0,
//播放语音相关参数
AUDIO:uni.createInnerAudioContext(),
playMsgid:null,
VoiceTimer:null,
// 抽屉参数
popupLayerClass:'',
// more参数
... ... @@ -215,15 +138,6 @@
//表情定义
hideEmoji:true,
emojiList:this.$commen.emojiList,
//红包相关参数
windowsState:'',
redenvelopeData:{
rid:null, //红包ID
from:null,
face:null,
blessing:null,
money:null
},
switchTab:'1',
plat:'android'
};
... ... @@ -273,9 +187,10 @@
}
})
},
onShow(){
/* onShow(){
console.log('onShow方法执行了')
this.scrollTop = 9999999;
},
}, */
onUnload(){
//退出页面 将所有的会话内的消息设置为已读
if(this.isSDKReady){
... ... @@ -318,6 +233,13 @@
}
}
},
closeSendGift(e){
if(e){
let msg = {text: this.userinfo.nickname+"给您送了"+e}
this.sendMsg(msg,'custom');
}
this.showSendGift = false
},
longtap(item){
uni.showModal({
title:'提示',
... ... @@ -397,7 +319,9 @@
if(newVal[0].ID != oldVal[0].ID && newVal.length>=this.count ){
this.$nextTick(()=> {this.scrollToView =oldVal[0].ID});
}else{
this.$nextTick(()=> {this.scrollToView =newVal[newVal.length-1].ID});
if(newVal.length > oldVal.length){
this.$nextTick(()=> {this.scrollToView =newVal[newVal.length-1].ID});
}
}
}else{
if(newVal.length > 0){
... ... @@ -407,23 +331,26 @@
},
//触发滑动到顶部(加载历史信息记录)
loadHistory(e){
// 更多消息列表
let conversationID = this.conversationActive.conversationID
let promise = this.tim.getMessageList({conversationID: conversationID,nextReqMessageID:this.nextReqMessageID,count: this.count});
promise.then((res)=> {
this.$store.commit('unshiftCurrentMessageList', res.data.messageList)
this.nextReqMessageID = res.data.nextReqMessageID // 用于续拉，分页续拉时需传入该字段。
this.isCompleted = res.data.isCompleted
});
uni.showLoading({
title:'加载中...'
})
this.scrollAnimation = false;//恢复滚动动画
// 更多消息列表
let conversationID = this.conversationActive.conversationID
let promise = this.tim.getMessageList({conversationID: conversationID,nextReqMessageID:this.nextReqMessageID,count: this.count});
promise.then((res)=> {
this.$store.commit('unshiftCurrentMessageList', res.data.messageList)
this.nextReqMessageID = res.data.nextReqMessageID // 用于续拉，分页续拉时需传入该字段。
this.isCompleted = res.data.isCompleted
//这段代码很重要，不然每次加载历史数据都会跳到顶部
/* this.$nextTick(function() {
this.$nextTick(() => {
this.scrollToView = this.nextReqMessageID;//跳转上次的第一行信息位置
this.$nextTick(function() {
this.$nextTick(() => {
this.scrollAnimation = true;//恢复滚动动画
});
}); */
});
uni.hideLoading()
});
},
// 加载初始页面消息
getMsgList(){
... ... @@ -437,41 +364,17 @@
this.$store.commit('pushCurrentMessageList', res.data.messageList)
this.nextReqMessageID = res.data.nextReqMessageID // 用于续拉，分页续拉时需传入该字段。
this.isCompleted = res.data.isCompleted
this.scrollToView = res.data.messageList[res.data.messageList.length-1].ID
})
// 滚动到底部
this.$nextTick(function() {
//进入页面滚动到底部
this.scrollTop = 9999;
this.$nextTick(function() {
this.scrollAnimation = true;
uni.hideLoading()
this.showRoom = true
// 滚动到底部
this.$nextTick(() => {
//进入页面滚动到底部
this.scrollToView = res.data.messageList[res.data.messageList.length-1].ID
this.$nextTick(() => {
this.scrollAnimation = true;
});
});
});
},
//处理图片尺寸，如果不处理宽高，新进入页面加载图片时候会闪
setPicSize(content){
// 让图片最长边等于设置的最大长度，短边等比例缩小，图片控件真实改变，区别于aspectFit方式。
let maxW = uni.upx2px(350);//350是定义消息图片最大宽度
let maxH = uni.upx2px(350);//350是定义消息图片最大高度
if(content.w>maxW||content.h>maxH){
let scale = content.w/content.h;
content.w = scale>1?maxW:maxH*scale;
content.h = scale>1?maxW/scale:maxH;
}
return content;
},
//更多功能(点击+弹出)
showMore(){
this.isVoice = false;
this.hideEmoji = true;
if(this.hideMore){
this.hideMore = false;
this.openDrawer();
}else{
this.hideDrawer();
}
this.showRoom = true
uni.hideLoading()
})
},
// 打开抽屉
openDrawer(){
... ... @@ -485,40 +388,6 @@
this.hideEmoji = true;
},150);
},
// 选择图片发送
chooseImage(){
this.getImage('album');
},
//拍照发送
camera(){
this.getImage('camera');
},
//发红包
handRedEnvelopes(){
uni.navigateTo({
url:'HM-hand/HM-hand'
});
this.hideDrawer();
},
//选照片 or 拍照
getImage(type){
this.hideDrawer();
uni.chooseImage({
sourceType:[type],
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
success: (res)=>{
for(let i=0;i<res.tempFilePaths.length;i++){
uni.getImageInfo({
src: res.tempFilePaths[i],
success: (image)=>{
let msg = {url:res.tempFilePaths[i],w:image.width,h:image.height};
this.sendMsg(msg,'img');
}
});
}
}
});
},
// 选择表情
chooseEmoji(){
this.hideMore = true;
... ... @@ -533,7 +402,6 @@
addEmoji(em){
this.textMsg+=em.alt;
},
//获取焦点，如果不是选表情ing,则关闭抽屉
textareaFocus(){
if(this.popupLayerClass=='showLayer' && this.hideMore == false){
... ... @@ -574,13 +442,31 @@
// 发送消息
sendMsg(content,type){
let message = this.tim.createTextMessage({
to: this.toUserId.toString(),
conversationType: 'C2C',
payload: {
text: content.text
}
});
let message
let toUserId = this.toUserId.toString()
if(type == 'text'){
message = this.tim.createTextMessage({
to: toUserId,
conversationType: 'C2C',
payload: {
text: content.text
}
});
}
if(type == 'custom'){
message = this.tim.createCustomMessage({
to: toUserId,
conversationType: 'C2C',
// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
// priority: TIM.TYPES.MSG_PRIORITY_HIGH,
payload: {
data: content.text, // 用于标识该消息是骰子类型消息
description: String(this.random(1,6)), // 获取骰子点数
extension: ''
}
});
}
this.$store.commit('pushCurrentMessageList', message)
let pomise = this.tim.sendMessage(message)
pomise.then(res=>{
... ... @@ -589,177 +475,10 @@
this.scrollToView = res.data.message.ID
});
})
},
// 添加文字消息到列表
addTextMsg(msg){
this.msgList.push(msg);
},
// 添加语音消息到列表
addVoiceMsg(msg){
this.msgList.push(msg);
},
// 添加图片消息到列表
addImgMsg(msg){
msg.msg.content = this.setPicSize(msg.msg.content);
this.msgImgList.push(msg.msg.content.url);
this.msgList.push(msg);
},
addRedEnvelopeMsg(msg){
this.msgList.push(msg);
},
// 添加系统文字消息到列表
addSystemTextMsg(msg){
this.msgList.push(msg);
},
// 添加系统红包消息到列表
addSystemRedEnvelopeMsg(msg){
this.msgList.push(msg);
},
// 打开红包
openRedEnvelope(msg,index){
let rid = msg.content.rid;
uni.showLoading({
title:'加载中...'
});
//模拟请求服务器效果
setTimeout(()=>{
//加载数据
if(rid==0){
this.redenvelopeData={
rid:0, //红包ID
from:"大黑哥",
face:"/static/img/im/face/face.jpg",
blessing:"恭喜发财，大吉大利",
money:"已领完"
}
}else{
this.redenvelopeData={
rid:1, //红包ID
from:"售后客服008",
face:"/static/img/im/face/face_2.jpg",
blessing:"恭喜发财",
money:"0.01"
}
if(!msg.content.isReceived){
// {type:"system",msg:{id:8,type:"redEnvelope",content:{text:"你领取了售后客服008的红包"}}},
this.sendSystemMsg({text:"你领取了"+(msg.userinfo.uid==this.myuid?"自己":msg.userinfo.username)+"的红包"},'redEnvelope');
this.msgList[index].msg.content.isReceived = true;
}
}
uni.hideLoading();
this.windowsState = 'show';
},200)
},
// 关闭红包弹窗
closeRedEnvelope(){
this.windowsState = 'hide';
setTimeout(()=>{
this.windowsState = '';
},200)
},
sendSystemMsg(content,type){
let lastid = this.msgList[this.msgList.length-1].msg.id;
lastid++;
let row = {type:"system",msg:{id:lastid,type:type,content:content}};
this.screenMsg(row)
},
//领取详情
toDetails(rid){
uni.navigateTo({
url:'HM-details/HM-details?rid='+rid
})
},
// 预览图片
showPic(msg){
uni.previewImage({
indicator:"none",
current:msg.content.url,
urls: this.msgImgList
});
},
// 播放语音
playVoice(msg){
this.playMsgid=msg.id;
this.AUDIO.src = msg.content.url;
this.$nextTick(function() {
this.AUDIO.play();
});
},
// 录音开始
voiceBegin(e){
if(e.touches.length>1){
return ;
}
this.initPoint.Y = e.touches[0].clientY;
this.initPoint.identifier = e.touches[0].identifier;
this.RECORDER.start({format:"mp3"});//录音开始,
},
//录音开始UI效果
recordBegin(e){
this.recording = true;
this.voiceTis='松开 结束';
this.recordLength = 0;
this.recordTimer = setInterval(()=>{
this.recordLength++;
},1000)
},
// 录音被打断
voiceCancel(){
this.recording = false;
this.voiceTis='按住 说话';
this.recordTis = '手指上滑 取消发送'
this.willStop = true;//不发送录音
this.RECORDER.stop();//录音结束
},
// 录音中(判断是否触发上滑取消发送)
voiceIng(e){
if(!this.recording){
return;
}
let touche = e.touches[0];
//上滑一个导航栏的高度触发上滑取消发送
if(this.initPoint.Y - touche.clientY>=uni.upx2px(100)){
this.willStop = true;
this.recordTis = '松开手指 取消发送'
}else{
this.willStop = false;
this.recordTis = '手指上滑 取消发送'
}
},
// 结束录音
voiceEnd(e){
if(!this.recording){
return;
}
this.recording = false;
this.voiceTis='按住 说话';
this.recordTis = '手指上滑 取消发送'
this.RECORDER.stop();//录音结束
},
//录音结束(回调文件)
recordEnd(e){
clearInterval(this.recordTimer);
if(!this.willStop){
let msg = {
length:0,
url:e.tempFilePath
}
let min = parseInt(this.recordLength/60);
let sec = this.recordLength%60;
min = min<10?'0'+min:min;
sec = sec<10?'0'+sec:sec;
msg.length = min+':'+sec;
this.sendMsg(msg,'voice');
}
this.willStop = false;
},
// 切换语音/文字输入
switchVoice(){
this.hideDrawer();
this.isVoice = this.isVoice?false:true;
random(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
},
discard(){
return;
... ...
... ... @@ -319,6 +319,7 @@ page{
}
.row{
.system{
padding: 20upx 0;
display: flex;
justify-content: center;
view{
... ... @@ -343,7 +344,6 @@ page{
&:first-child{
margin-top: 20upx;
}
padding: 20upx 0;
.my .left,.other .right{
width: 100%;
display: flex;
... ... @@ -425,6 +425,7 @@ page{
}
}
.my{
padding: 20upx 0;
width: 100%;
display: flex;
justify-content: flex-end;
... ... @@ -491,6 +492,7 @@ page{
}
}
.other{
padding: 20upx 0;
width: 100%;
display: flex;
.left{
... ...
... ... @@ -67,7 +67,6 @@ const store=new Vuex.Store({
state.userinfo=[
];
console.log(state.userinfo)
uni.setStorageSync('userinfo','')
uni.setStorageSync('token','')
},
... ... @@ -124,13 +123,11 @@ const store=new Vuex.Store({
} else if (data.conversationID === state.conversationActive.conversationID) {
state.currentMessageList = [...state.currentMessageList, data]
}
console.log( state.currentMessageList)
},
/**
* 滑到顶部请求更多的历史消息
* */
unshiftCurrentMessageList(state,data){
console.log(data)
if(data && state.currentMessageList.length > 1){
state.currentMessageList = [...data,...state.currentMessageList]
}
... ...