更换socket
parent
bbe315fb45
commit
83b2295818
|
@ -10,8 +10,7 @@
|
||||||
<!-- 消息 -->
|
<!-- 消息 -->
|
||||||
<view class="flex-column-start" v-if="msgList.length" v-for="(item, index) in msgList" :key="index">
|
<view class="flex-column-start" v-if="msgList.length" v-for="(item, index) in msgList" :key="index">
|
||||||
<view class="flex-row-start column-time">
|
<view class="flex-row-start column-time">
|
||||||
<view v-show="compareTime(index, item.createTime)" class="flex-row-start date-text"
|
<view v-show="compareTime(index, item.createTime)" class="flex-row-start date-text">
|
||||||
>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 用户消息 头像可选加入-->
|
<!-- 用户消息 头像可选加入-->
|
||||||
|
@ -20,68 +19,71 @@
|
||||||
<view>
|
<view>
|
||||||
<view class="user-name">{{ user.nickName }}</view>
|
<view class="user-name">{{ user.nickName }}</view>
|
||||||
<view class="margin-left padding-chat bg-user-orang" style="border-radius: 35rpx; ">
|
<view class="margin-left padding-chat bg-user-orang" style="border-radius: 35rpx; ">
|
||||||
<text style="word-break: break-all;" v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
<text style="word-break: break-all;"
|
||||||
<!-- <view v-if="item.messageType == 'GOODS'">
|
v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
||||||
<view class="goodsCard u-flex u-row-between u-p-b-0" style="width:100%;margin: 0 0; ">
|
<view v-if="item.messageType == 'GOODS'">
|
||||||
|
<view class="goodsCard u-flex u-row-between u-p-b-0"
|
||||||
|
style="width:100%;margin: 0 0; ">
|
||||||
<view class="imagebox" @click="jumpGoodDelic">
|
<view class="imagebox" @click="jumpGoodDelic">
|
||||||
<image class="image" :src="JSON.parse(item.text)['thumbnail']" mode="widthFix"></image>
|
<image class="image" :src="JSON.parse(item.text)['thumbnail']"
|
||||||
|
mode="widthFix"></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="goodsdesc" @click="jumpGoodDelic">
|
<view class="goodsdesc" @click="jumpGoodDelic">
|
||||||
<view class="goodsdesc-name">
|
<view class="goodsdesc-name">
|
||||||
<text class="goodsCard_goodNmae">{{
|
<text class="goodsCard_goodNmae">{{
|
||||||
JSON.parse(item.text)['goodsName']
|
JSON.parse(item.text)['goodsName']
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text
|
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text
|
||||||
style="font-size:20rpx;">¥{{
|
style="font-size:20rpx;">¥{{
|
||||||
JSON.parse(item.text)['price']
|
JSON.parse(item.text)['price']
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view>
|
||||||
<!-- <view v-if="item.messageType === 'ORDER'">
|
<view v-if="item.messageType == 'ORDER'">
|
||||||
<view class="orderSn">
|
<view class="orderSn">
|
||||||
<text>订单号:{{ JSON.parse(item.text)['sn'] }}</text>
|
<text>订单号:{{ JSON.parse(item.text)['sn'] }}</text>
|
||||||
<view class="oederList">
|
<view class="oederList">
|
||||||
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
||||||
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
||||||
<view class="groupNameOrTime">
|
<view class="groupNameOrTime">
|
||||||
<text @click="linkTosOrders(JSON.parse(item.text)['sn'])">{{ JSON.parse(item.text)['groupName']
|
<text @click="linkTosOrders(item.text)">{{ JSON.parse(item.text)['groupName']
|
||||||
}}</text>
|
}}</text>
|
||||||
<view class="orderTime"> <text>{{ JSON.parse(item.text)['paymentTime'] }}</text></view>
|
<view class="orderTime">
|
||||||
|
<text>{{ JSON.parse(item.text)['paymentTime'] }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view>
|
<view>
|
||||||
<u-avatar :src="user.face" :text="user.face ? '' : user.name" bg-color="#DDDDDD"></u-avatar>
|
<u-avatar :src="user.face" :text="user.face ? '' : user.name" bg-color="#DDDDDD"></u-avatar>
|
||||||
<!-- <u-image class="chat-img margin-left" style="height: 100rpx;width: 100rpx;" shape="circle"
|
|
||||||
:src="user.face || 'https://avatars.dicebear.com/api/initials/' + user.nickName + '.svg?fontSize=38'"
|
|
||||||
mode="aspectFill"></u-image> -->
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<!-- 接收人消息 -->
|
<!-- 接收人消息 -->
|
||||||
<view v-else class="flex-row-start margin-left margin-top one-show">
|
<view v-else class="flex-row-start margin-left margin-top one-show">
|
||||||
<view class="chat-img flex-row-center">
|
<view class="chat-img flex-row-center">
|
||||||
<u-avatar :src="toUser.face" :text="toUser.face ? '' : toUser.name" bg-color="#DDDDDD"></u-avatar>
|
<u-avatar :src="toUser.face" :text="toUser.face ? '' : toUser.name" bg-color="#DDDDDD">
|
||||||
<!-- <u-image style="height: 100rpx;width: 100rpx;" shape="circle"
|
</u-avatar>
|
||||||
:src="toUser.face || 'https://avatars.dicebear.com/api/initials/' + toUser.name + '.svg?fontSize=38'"
|
|
||||||
mode="aspectFit"></u-image> -->
|
|
||||||
</view>
|
</view>
|
||||||
<view class="flex" style="width: 500rpx;">
|
<view class="flex" style="width: 500rpx;">
|
||||||
<view>
|
<view>
|
||||||
<view class="other-name">{{ toUser.name }}</view>
|
<view class="other-name">{{ toUser.name }}</view>
|
||||||
<view class="margin-left padding-chat flex-column-start bg-to-color" style="border-radius: 35rpx;">
|
<view class="margin-left padding-chat flex-column-start bg-to-color"
|
||||||
<text style="word-break: break-all;" v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
style="border-radius: 35rpx;">
|
||||||
|
<text style="word-break: break-all;"
|
||||||
|
v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
||||||
<view v-if="item.messageType === 'GOODS'">
|
<view v-if="item.messageType === 'GOODS'">
|
||||||
<!-- <view class="goodsCard u-flex u-row-between u-p-b-0" style="width:100%;margin: 0 0; ">
|
<view class="goodsCard u-flex u-row-between u-p-b-0"
|
||||||
|
style="width:100%;margin: 0 0; ">
|
||||||
<view class="imagebox" @click="jumpGoodDelic">
|
<view class="imagebox" @click="jumpGoodDelic">
|
||||||
<image class="image" :src="JSON.parse(item.text)['thumbnail']" mode="widthFix"></image>
|
<image class="image" :src="JSON.parse(item.text)['thumbnail']"
|
||||||
|
mode="widthFix"></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="goodsdesc" @click="jumpGoodDelic">
|
<view class="goodsdesc" @click="jumpGoodDelic">
|
||||||
<view class="goodsdesc-name">
|
<view class="goodsdesc-name">
|
||||||
|
@ -95,22 +97,24 @@
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
|
||||||
</view>
|
</view>
|
||||||
<!-- <view v-if="item.messageType === 'ORDER'">
|
</view>
|
||||||
|
<view v-if="item.messageType === 'ORDER'">
|
||||||
<view class="orderSn">
|
<view class="orderSn">
|
||||||
<text>订单号:{{ JSON.parse(item.text)['sn'] }}</text>
|
<text>订单号:{{ JSON.parse(item.text)['sn'] }}</text>
|
||||||
<view class="oederList">
|
<view class="oederList">
|
||||||
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
||||||
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
||||||
<view class="groupNameOrTime">
|
<view class="groupNameOrTime">
|
||||||
<text @click="linkTosOrders(JSON.parse(item.text)['sn'])">{{ JSON.parse(item.text)['groupName']
|
<text @click="linkTosOrders(item.text)">{{ JSON.parse(item.text)['groupName']
|
||||||
}}</text>
|
}}</text>
|
||||||
<view class="orderTime"> <text>{{ JSON.parse(item.text)['paymentTime'] }}</text></view>
|
<view class="orderTime">
|
||||||
|
<text>{{ JSON.parse(item.text)['paymentTime'] }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
@ -129,11 +133,12 @@
|
||||||
<view class="goodsdesc-name">
|
<view class="goodsdesc-name">
|
||||||
<text class="goodsCard_goodNmae">{{
|
<text class="goodsCard_goodNmae">{{
|
||||||
goodListData.goodsName
|
goodListData.goodsName
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text style="font-size:20rpx;">¥{{
|
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text
|
||||||
|
style="font-size:20rpx;">¥{{
|
||||||
goodListData.price
|
goodListData.price
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cancel" @click="cancelModel">X</view>
|
<view class="cancel" @click="cancelModel">X</view>
|
||||||
|
@ -151,9 +156,9 @@
|
||||||
<view class="flex" style="width: 500rpx;">
|
<view class="flex" style="width: 500rpx;">
|
||||||
<view class="margin-left padding-chat flex-column-start"
|
<view class="margin-left padding-chat flex-column-start"
|
||||||
style="border-radius: 35rpx;background-color: #f9f9f9;">
|
style="border-radius: 35rpx;background-color: #f9f9f9;">
|
||||||
<view class="cuIcon-loading turn-load" style="font-size: 35rpx;color: #3e9982;">
|
<!-- <view class="cuIcon-loading turn-load" style="font-size: 35rpx;color: #3e9982;">
|
||||||
|
|
||||||
</view>
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -165,8 +170,9 @@
|
||||||
<view class="flex-column-center" style="position: fixed;bottom: -180px;" :animation="animationData">
|
<view class="flex-column-center" style="position: fixed;bottom: -180px;" :animation="animationData">
|
||||||
<view class="bottom-dh-char flex-row-around" style="font-size: 55rpx;">
|
<view class="bottom-dh-char flex-row-around" style="font-size: 55rpx;">
|
||||||
<!-- vue无法使用软键盘"发送" -->
|
<!-- vue无法使用软键盘"发送" -->
|
||||||
<input v-model="msg" class="dh-input" type="text" style="background-color: #f0f0f0;" @confirm="sendMessage"
|
<input v-model="msg" class="dh-input" type="text" style="background-color: #f0f0f0;"
|
||||||
confirm-type="search" placeholder-class="my-neirong-sm" placeholder="用一句简短的话描述您的问题" />
|
@confirm="sendMessage" confirm-type="search" placeholder-class="my-neirong-sm"
|
||||||
|
placeholder="用一句简短的话描述您的问题" />
|
||||||
<view @click="sendMessage" class="cu-tag bg-cyan round">
|
<view @click="sendMessage" class="cu-tag bg-cyan round">
|
||||||
发送
|
发送
|
||||||
</view>
|
</view>
|
||||||
|
@ -188,26 +194,42 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// rpx和px的比率
|
// rpx和px的比率
|
||||||
var l
|
var l
|
||||||
// 可用窗口高度
|
// 可用窗口高度
|
||||||
var wh
|
var wh
|
||||||
// 顶部空盒子的高度
|
// 顶部空盒子的高度
|
||||||
var mgUpHeight
|
var mgUpHeight
|
||||||
import { getTalkMessage, getTalkByUser, jumpObtain } from "@/api/im.js";
|
import {
|
||||||
import SocketService from "@/utils/socket_service.js";
|
getTalkMessage,
|
||||||
import storage from "@/utils/storage.js";
|
getTalkByUser,
|
||||||
import { beautifyTime } from "@/utils/filters.js"
|
jumpObtain
|
||||||
export default {
|
} from "@/api/im.js";
|
||||||
|
import SocketService from "@/utils/socket_service.js";
|
||||||
|
import storage from "@/utils/storage.js";
|
||||||
|
import {
|
||||||
|
beautifyTime
|
||||||
|
} from "@/utils/filters.js"
|
||||||
|
import config from '@/config/config.js'
|
||||||
|
export default {
|
||||||
// 页面卸载后清除imGoodId
|
// 页面卸载后清除imGoodId
|
||||||
onUnload () {
|
onUnload() {
|
||||||
storage.setImGoodsLink('')
|
// #ifdef H5
|
||||||
|
uni.setStorageSync("imGoodId", '');
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
if (this.socketOpen == true) {
|
||||||
|
uni.closeSocket();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
onLoad (options) {
|
onLoad(options) {
|
||||||
|
this.sokcet();
|
||||||
// 没有goodsid则不显示 发送商品弹窗
|
// 没有goodsid则不显示 发送商品弹窗
|
||||||
this.showHideModel = options.goodsid
|
this.showHideModel = options.goodsid
|
||||||
// 发送后刷新页面不显示 发送商品弹窗 local里面imGoodId不为空显示
|
// 发送后刷新页面不显示 发送商品弹窗 local里面imGoodId不为空显示
|
||||||
this.localImGoodsId = storage.getImGoodsLink()
|
// #ifdef H5
|
||||||
|
this.localImGoodsId = uni.getStorageSync("imGoodId");
|
||||||
|
// #endif
|
||||||
this.resolve = options
|
this.resolve = options
|
||||||
// 请求商品信息
|
// 请求商品信息
|
||||||
if (this.resolve.goodsid) {
|
if (this.resolve.goodsid) {
|
||||||
|
@ -249,18 +271,20 @@ export default {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.ws.connect();
|
// this.ws.connect();
|
||||||
|
this.sokcet()
|
||||||
},
|
},
|
||||||
onPullDownRefresh () {
|
onPullDownRefresh() {
|
||||||
this.params.pageNumber = this.params.pageNumber + 1
|
this.params.pageNumber = this.params.pageNumber + 1
|
||||||
this.getTalkMessage()
|
this.getTalkMessage()
|
||||||
setTimeout(function () {
|
setTimeout(function() {
|
||||||
uni.stopPullDownRefresh();
|
uni.stopPullDownRefresh();
|
||||||
}, 1000);
|
}, 1000);
|
||||||
},
|
},
|
||||||
|
|
||||||
data () {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
socketOpen: false, //是否连接
|
||||||
storage,
|
storage,
|
||||||
fixed: 'fixed',
|
fixed: 'fixed',
|
||||||
bottom: '50px',
|
bottom: '50px',
|
||||||
|
@ -290,39 +314,55 @@ export default {
|
||||||
goodListData: {}
|
goodListData: {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
// watch: {
|
||||||
'ws.callBackMapping': {
|
// 'ws.callBackMapping': {
|
||||||
handler: function (val) {
|
// handler: function (val) {
|
||||||
val = JSON.parse(val)
|
// val = JSON.parse(val)
|
||||||
if (val.messageResultType == 'MESSAGE') {
|
// if (val.messageResultType == 'MESSAGE') {
|
||||||
this.msgList.push(val.result)
|
// this.msgList.push(val.result)
|
||||||
}
|
// }
|
||||||
this.newMessageNum++;
|
// this.newMessageNum++;
|
||||||
//接收到消息后发送已读
|
// //接收到消息后发送已读
|
||||||
let msg = val
|
// let msg = val
|
||||||
msg.operation_type = 'READ'
|
// msg.operation_type = 'READ'
|
||||||
this.ws.send(JSON.stringify(msg))
|
// this.ws.send(JSON.stringify(msg))
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
},
|
// },
|
||||||
methods: {
|
methods: {
|
||||||
beautifyTime,
|
sendMessage() {
|
||||||
//订单详情
|
if (this.msg == "") {
|
||||||
linkTosOrders (val) {
|
return 0;
|
||||||
console.log(val);
|
}
|
||||||
uni.navigateTo({
|
if (this.socketOpen == false) {
|
||||||
url: '/pages/order/orderDetail?sn=' + val,
|
return
|
||||||
|
}
|
||||||
|
let msg = {
|
||||||
|
operation_type: "MESSAGE",
|
||||||
|
to: this.toUser.userId,
|
||||||
|
from: this.user.id,
|
||||||
|
message_type: "MESSAGE",
|
||||||
|
context: this.msg,
|
||||||
|
talk_id: this.params.talkId,
|
||||||
|
}
|
||||||
|
let data = JSON.stringify(msg);
|
||||||
|
try {
|
||||||
|
uni.sendSocketMessage({
|
||||||
|
data: data
|
||||||
});
|
});
|
||||||
|
this.msgList.push({
|
||||||
|
"text": this.msg,
|
||||||
|
"my": true,
|
||||||
|
"messageType": 'MESSAGE'
|
||||||
|
})
|
||||||
|
let type = 'down';
|
||||||
|
this.msgGo(type)
|
||||||
|
this.msg = ""
|
||||||
|
} catch (e) {
|
||||||
|
uni.closeSocket();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 跳转商品详情页
|
sendGoodsMessage() {
|
||||||
jumpGoodDelic () {
|
|
||||||
uni.navigateTo({
|
|
||||||
url: `/pages/product/goods?id=${this.resolve.skuid}&goodsId=${this.resolve.goodsid}`,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
//发送商品
|
|
||||||
sendGoodsMessage () {
|
|
||||||
let msg = {
|
let msg = {
|
||||||
operation_type: "MESSAGE",
|
operation_type: "MESSAGE",
|
||||||
to: this.toUser.userId,
|
to: this.toUser.userId,
|
||||||
|
@ -331,32 +371,101 @@ export default {
|
||||||
context: this.goodListData,
|
context: this.goodListData,
|
||||||
talk_id: this.params.talkId,
|
talk_id: this.params.talkId,
|
||||||
}
|
}
|
||||||
this.ws.send(JSON.stringify(msg))
|
let data = JSON.stringify(msg);
|
||||||
this.msgList.push({ "text": JSON.stringify(this.goodListData), "my": true, "messageType": 'GOODS' })
|
uni.sendSocketMessage({
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
this.msgList.push({
|
||||||
|
"text": JSON.stringify(this.goodListData),
|
||||||
|
"my": true,
|
||||||
|
"messageType": 'GOODS'
|
||||||
|
})
|
||||||
this.showHide = false
|
this.showHide = false
|
||||||
storage.setImGoodsLink(this.params.talkId)
|
// #ifdef H5
|
||||||
//成功发送商品连接后,滚动到底部
|
uni.setStorageSync("imGoodId", 1111111);
|
||||||
|
// #endif
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
uni.pageScrollTo({
|
uni.pageScrollTo({
|
||||||
scrollTop: 2000000,
|
scrollTop: 2000000,
|
||||||
duration: 0
|
duration: 300
|
||||||
});
|
});
|
||||||
|
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
sokcet() {
|
||||||
|
var _this = this;
|
||||||
|
uni.closeSocket();
|
||||||
|
this.socketOpen = false;
|
||||||
|
try {
|
||||||
|
//WebSocket的地址
|
||||||
|
var url = config.baseWsUrl + '/' + storage.getAccessToken();
|
||||||
|
// 连接
|
||||||
|
uni.connectSocket({
|
||||||
|
url: url,
|
||||||
|
});
|
||||||
|
// 监听WebSocket连接已打开
|
||||||
|
uni.onSocketOpen(function(res) {
|
||||||
|
_this.socketOpen = true;
|
||||||
|
});
|
||||||
|
// 监听连接失败
|
||||||
|
uni.onSocketError(function(err) {
|
||||||
|
if (err && err.code !== 1000) {
|
||||||
|
setTimeout(function() {
|
||||||
|
_this.socketOpen = true;
|
||||||
|
uni.connectSocket({
|
||||||
|
url: url,
|
||||||
|
});
|
||||||
|
}, 5 * 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// 监听连接关闭
|
||||||
|
uni.onSocketClose(function(err) {
|
||||||
|
if (err && err.code !== 1000) {
|
||||||
|
setTimeout(function() {
|
||||||
|
_this.socketOpen = true;
|
||||||
|
uni.connectSocket({
|
||||||
|
url: url,
|
||||||
|
});
|
||||||
|
}, 5 * 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// 监听收到信息
|
||||||
|
uni.onSocketMessage(function(res) {
|
||||||
|
uni.hideLoading()
|
||||||
|
})
|
||||||
|
} catch (e) {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
beautifyTime,
|
||||||
|
//订单详情
|
||||||
|
linkTosOrders(val) {
|
||||||
|
let order = JSON.parse(val)
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/order/orderDetail?sn=' + order.sn,
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
// 跳转商品详情页
|
||||||
|
jumpGoodDelic() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/goods?id=${this.resolve.skuid}&goodsId=${this.resolve.goodsid}`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
//取消发送
|
//取消发送
|
||||||
cancelModel () {
|
cancelModel() {
|
||||||
this.showHide = false
|
this.showHide = false
|
||||||
},
|
},
|
||||||
// 请求商品详情
|
// 请求商品详情
|
||||||
commodityDetails () {
|
commodityDetails() {
|
||||||
jumpObtain(this.resolve.skuid, this.resolve.goodsid).then((res) => {
|
jumpObtain(this.resolve.skuid, this.resolve.goodsid).then((res) => {
|
||||||
this.goodListData = res.data.result.data
|
this.goodListData = res.data.result.data
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
// 切换输入法时移动输入框(按照官方的上推页面的原理应该会自动适应不同的键盘高度-->官方bug)
|
// 切换输入法时移动输入框(按照官方的上推页面的原理应该会自动适应不同的键盘高度-->官方bug)
|
||||||
goPag (kh) {
|
goPag(kh) {
|
||||||
this.retractBox(0, 250)
|
this.retractBox(0, 250)
|
||||||
if (this.keyHeight != 0) {
|
if (this.keyHeight != 0) {
|
||||||
if (kh - this.keyHeight > 0) {
|
if (kh - this.keyHeight > 0) {
|
||||||
|
@ -366,7 +475,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 移动顶部的空盒子
|
// 移动顶部的空盒子
|
||||||
messageBoxMove (x, t) {
|
messageBoxMove(x, t) {
|
||||||
var animation = uni.createAnimation({
|
var animation = uni.createAnimation({
|
||||||
duration: t,
|
duration: t,
|
||||||
timingFunction: 'linear',
|
timingFunction: 'linear',
|
||||||
|
@ -379,7 +488,7 @@ export default {
|
||||||
this.anData = animation.export()
|
this.anData = animation.export()
|
||||||
},
|
},
|
||||||
// 保持消息体可见
|
// 保持消息体可见
|
||||||
msgGo (type) {
|
msgGo(type) {
|
||||||
console.log(type, 'typetypetype');
|
console.log(type, 'typetypetype');
|
||||||
const query = uni.createSelectorQuery()
|
const query = uni.createSelectorQuery()
|
||||||
// 延时100ms保证是最新的高度
|
// 延时100ms保证是最新的高度
|
||||||
|
@ -419,34 +528,39 @@ export default {
|
||||||
}, 100)
|
}, 100)
|
||||||
},
|
},
|
||||||
// 回答问题的业务逻辑
|
// 回答问题的业务逻辑
|
||||||
answer (id) {
|
answer(id) {
|
||||||
// 这里应该传入问题的id,模拟就用index代替了
|
// 这里应该传入问题的id,模拟就用index代替了
|
||||||
|
|
||||||
},
|
},
|
||||||
sendMessage () {
|
// sendMessage() {
|
||||||
// 消息为空不做任何操作
|
// // 消息为空不做任何操作
|
||||||
if (this.msg == "") {
|
// if (this.msg == "") {
|
||||||
return 0;
|
// return 0;
|
||||||
}
|
// }
|
||||||
// 显示消息 msg消息文本,my鉴别是谁发的消息(不能用俩个消息数组循环,否则消息不会穿插)
|
// // 显示消息 msg消息文本,my鉴别是谁发的消息(不能用俩个消息数组循环,否则消息不会穿插)
|
||||||
let msg = {
|
// let msg = {
|
||||||
operation_type: "MESSAGE",
|
// operation_type: "MESSAGE",
|
||||||
to: this.toUser.userId,
|
// to: this.toUser.userId,
|
||||||
from: this.user.id,
|
// from: this.user.id,
|
||||||
message_type: "MESSAGE",
|
// message_type: "MESSAGE",
|
||||||
context: this.msg,
|
// context: this.msg,
|
||||||
talk_id: this.params.talkId,
|
// talk_id: this.params.talkId,
|
||||||
}
|
// }
|
||||||
this.ws.send(JSON.stringify(msg))
|
// this.ws.send(JSON.stringify(msg))
|
||||||
this.msgList.push({ "text": this.msg, "my": true, "messageType": 'MESSAGE' })
|
// this.msgList.push({
|
||||||
// 保证消息可见
|
// "text": this.msg,
|
||||||
let type = 'down';
|
// "my": true,
|
||||||
this.msgGo(type)
|
// "messageType": 'MESSAGE'
|
||||||
// 回答问题
|
// })
|
||||||
// this.msgKf(this.msg)
|
// console.log(this.msgList, 'this.msgListthis.msgListthis.msgListthis.msgListthis.msgList')
|
||||||
// 清除消息
|
// // 保证消息可见
|
||||||
this.msg = ""
|
// let type = 'down';
|
||||||
},
|
// this.msgGo(type)
|
||||||
|
// // 回答问题
|
||||||
|
// // this.msgKf(this.msg)
|
||||||
|
// // 清除消息
|
||||||
|
// this.msg = ""
|
||||||
|
// },
|
||||||
// msgKf(x) {
|
// msgKf(x) {
|
||||||
// // loading
|
// // loading
|
||||||
// // this.msgLoad = true
|
// // this.msgLoad = true
|
||||||
|
@ -460,7 +574,7 @@ export default {
|
||||||
// // }, 2000)
|
// // }, 2000)
|
||||||
// },
|
// },
|
||||||
// 不建议输入框聚焦时操作此动画
|
// 不建议输入框聚焦时操作此动画
|
||||||
ckAdd () {
|
ckAdd() {
|
||||||
if (!this.showTow) {
|
if (!this.showTow) {
|
||||||
this.retractBox(-180, 350)
|
this.retractBox(-180, 350)
|
||||||
} else {
|
} else {
|
||||||
|
@ -468,11 +582,11 @@ export default {
|
||||||
}
|
}
|
||||||
this.showTow = !this.showTow
|
this.showTow = !this.showTow
|
||||||
},
|
},
|
||||||
hideKey () {
|
hideKey() {
|
||||||
uni.hideKeyboard()
|
uni.hideKeyboard()
|
||||||
},
|
},
|
||||||
// 拉起/收回附加栏
|
// 拉起/收回附加栏
|
||||||
retractBox (x, t) {
|
retractBox(x, t) {
|
||||||
|
|
||||||
var animation = uni.createAnimation({
|
var animation = uni.createAnimation({
|
||||||
duration: t,
|
duration: t,
|
||||||
|
@ -485,7 +599,7 @@ export default {
|
||||||
|
|
||||||
this.animationData = animation.export()
|
this.animationData = animation.export()
|
||||||
},
|
},
|
||||||
async getTalkMessage () {
|
async getTalkMessage() {
|
||||||
let type = '';
|
let type = '';
|
||||||
await getTalkMessage(this.params).then(res => {
|
await getTalkMessage(this.params).then(res => {
|
||||||
if (res.data.success) {
|
if (res.data.success) {
|
||||||
|
@ -503,17 +617,16 @@ export default {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
this.msgGo(type)
|
this.msgGo(type)
|
||||||
},
|
},
|
||||||
touchMoreMessage (e) {
|
touchMoreMessage(e) {
|
||||||
if (e.target.scrollTop == 0) {
|
if (e.target.scrollTop == 0) {
|
||||||
this.params.pageNumber = this.params.pageNumber + 1
|
this.params.pageNumber = this.params.pageNumber + 1
|
||||||
this.getTalkMessage()
|
this.getTalkMessage()
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
async getTalk (userId) {
|
async getTalk(userId) {
|
||||||
getTalkByUser(userId).then(res => {
|
getTalkByUser(userId).then(res => {
|
||||||
if (res.data.success) {
|
if (res.data.success) {
|
||||||
this.toUser = res.data.result
|
this.toUser = res.data.result
|
||||||
|
@ -523,7 +636,7 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
// 处理消息时间是否显示
|
// 处理消息时间是否显示
|
||||||
compareTime (index, datetime) {
|
compareTime(index, datetime) {
|
||||||
if (datetime == undefined) {
|
if (datetime == undefined) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
@ -534,8 +647,10 @@ export default {
|
||||||
if (this.msgList[index].is_revoke == 1) {
|
if (this.msgList[index].is_revoke == 1) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
if (datetime) {
|
||||||
datetime = datetime.replace(/-/g, "/");
|
datetime = datetime.replace(/-/g, "/");
|
||||||
|
}
|
||||||
|
|
||||||
let time = Math.floor(Date.parse(datetime) / 1000);
|
let time = Math.floor(Date.parse(datetime) / 1000);
|
||||||
let currTime = Math.floor(new Date().getTime() / 1000);
|
let currTime = Math.floor(new Date().getTime() / 1000);
|
||||||
|
|
||||||
|
@ -546,7 +661,7 @@ export default {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
let nextDate
|
let nextDate
|
||||||
if (this.msgList[index + 1]) {
|
if (this.msgList[index + 1] && this.msgList[index + 1].createTime) {
|
||||||
nextDate = this.msgList[index + 1].createTime.replace(/-/g, "/");
|
nextDate = this.msgList[index + 1].createTime.replace(/-/g, "/");
|
||||||
if (nextDate - datetime < 300) return false;
|
if (nextDate - datetime < 300) return false;
|
||||||
}
|
}
|
||||||
|
@ -563,7 +678,7 @@ export default {
|
||||||
* @param format 转换格式
|
* @param format 转换格式
|
||||||
* @returns {*|string}
|
* @returns {*|string}
|
||||||
*/
|
*/
|
||||||
unixToDate (unix, format) {
|
unixToDate(unix, format) {
|
||||||
if (!unix) return unix;
|
if (!unix) return unix;
|
||||||
let _format = format || "yyyy-MM-dd hh:mm:ss";
|
let _format = format || "yyyy-MM-dd hh:mm:ss";
|
||||||
const d = new Date(unix);
|
const d = new Date(unix);
|
||||||
|
@ -585,55 +700,55 @@ export default {
|
||||||
if (new RegExp("(" + k + ")").test(_format))
|
if (new RegExp("(" + k + ")").test(_format))
|
||||||
_format = _format.replace(
|
_format = _format.replace(
|
||||||
RegExp.$1,
|
RegExp.$1,
|
||||||
RegExp.$1.length === 1
|
RegExp.$1.length === 1 ?
|
||||||
? o[k]
|
o[k] :
|
||||||
: ("00" + o[k]).substr(("" + o[k]).length)
|
("00" + o[k]).substr(("" + o[k]).length)
|
||||||
);
|
);
|
||||||
return _format;
|
return _format;
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.orderTime {
|
.orderTime {
|
||||||
margin-top: 15rpx;
|
margin-top: 15rpx;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
height: auto !important;
|
height: auto !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.oederList {
|
.oederList {
|
||||||
display: flex;
|
display: flex;
|
||||||
color: black;
|
color: black;
|
||||||
font-size: 20rpx;
|
font-size: 20rpx;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
width: 95%;
|
width: 95%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.orderSn {
|
.orderSn {
|
||||||
width: 350rpx;
|
width: 350rpx;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.groupNameOrTime {
|
.groupNameOrTime {
|
||||||
margin: 15rpx 15rpx;
|
margin: 15rpx 15rpx;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.orderGood {
|
.orderGood {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goodsCard {
|
.goodsCard {
|
||||||
border-radius: 20rpx;
|
border-radius: 20rpx;
|
||||||
margin-top: 15rpx;
|
margin-top: 15rpx;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
|
@ -700,104 +815,104 @@ export default {
|
||||||
top: 20rpx;
|
top: 20rpx;
|
||||||
right: 20rpx;
|
right: 20rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.cancel {
|
.cancel {
|
||||||
color: #737373;
|
color: #737373;
|
||||||
position: relative;
|
position: relative;
|
||||||
bottom: 40rpx;
|
bottom: 40rpx;
|
||||||
left: 12%;
|
left: 12%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cartMessage {
|
.cartMessage {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bottom-dh-char {
|
.bottom-dh-char {
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
width: 750rpx;
|
width: 750rpx;
|
||||||
height: 110rpx;
|
height: 110rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-name {
|
.user-name {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
color: #737373;
|
color: #737373;
|
||||||
margin-bottom: 10rpx;
|
margin-bottom: 10rpx;
|
||||||
margin-right: 10rpx;
|
margin-right: 10rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.other-name {
|
.other-name {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
color: #737373;
|
color: #737373;
|
||||||
margin-bottom: 10rpx;
|
margin-bottom: 10rpx;
|
||||||
margin-left: 10rpx;
|
margin-left: 10rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.column-time {
|
.column-time {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center-box {
|
.center-box {
|
||||||
width: 720rpx;
|
width: 720rpx;
|
||||||
padding-left: 25rpx;
|
padding-left: 25rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hui-box {
|
.hui-box {
|
||||||
width: 750rpx;
|
width: 750rpx;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.date-text {
|
.date-text {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: grey;
|
color: grey;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dh-input {
|
.dh-input {
|
||||||
width: 500rpx;
|
width: 500rpx;
|
||||||
height: 65rpx;
|
height: 65rpx;
|
||||||
border-radius: 30rpx;
|
border-radius: 30rpx;
|
||||||
padding-left: 15rpx;
|
padding-left: 15rpx;
|
||||||
font-size: 35rpx;
|
font-size: 35rpx;
|
||||||
background-color: #FFFFFF;
|
background-color: #FFFFFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box-normal {
|
.box-normal {
|
||||||
width: 750rpx;
|
width: 750rpx;
|
||||||
height: 180px;
|
height: 180px;
|
||||||
background-color: #FFFFFF;
|
background-color: #FFFFFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tb-text view {
|
.tb-text view {
|
||||||
font-size: 65rpx;
|
font-size: 65rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tb-text text {
|
.tb-text text {
|
||||||
font-size: 25rpx;
|
font-size: 25rpx;
|
||||||
color: #737373;
|
color: #737373;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-img {
|
.chat-img {
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
width: 100rpx;
|
width: 100rpx;
|
||||||
height: 100rpx;
|
height: 100rpx;
|
||||||
background-color: #f7f7f7;
|
background-color: #f7f7f7;
|
||||||
}
|
}
|
||||||
|
|
||||||
.padding-chat {
|
.padding-chat {
|
||||||
padding: 17rpx 20rpx;
|
padding: 17rpx 20rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tb-nv {
|
.tb-nv {
|
||||||
width: 50rpx;
|
width: 50rpx;
|
||||||
height: 50rpx;
|
height: 50rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./index-app.scss";
|
@import "./index-app.scss";
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -601,10 +601,10 @@ export default {
|
||||||
|
|
||||||
linkMsgDetail () {
|
linkMsgDetail () {
|
||||||
// lili 基础客服
|
// lili 基础客服
|
||||||
this.$options.filters.talkIm(this.storeDetail.storeId)
|
// this.$options.filters.talkIm(this.storeDetail.storeId)
|
||||||
// uni.navigateTo({
|
uni.navigateTo({
|
||||||
// url: `/pages/mine/im/index?userId=${this.goodsDetail.storeId}&goodsid=${this.routerVal.goodsId}&skuid=${this.routerVal.id}`
|
url: `/pages/mine/im/index?userId=${this.goodsDetail.storeId}&goodsid=${this.routerVal.goodsId}&skuid=${this.routerVal.id}`
|
||||||
// });
|
});
|
||||||
|
|
||||||
// udesk 代码
|
// udesk 代码
|
||||||
// if (this.storeDetail.merchantEuid) {
|
// if (this.storeDetail.merchantEuid) {
|
||||||
|
|
Loading…
Reference in New Issue