ch
3 years ago
@ -0,0 +1,35 @@
|
||||
/*
|
||||
* @Author: ch
|
||||
* @Date: 2022-05-10 20:50:54
|
||||
* @LastEditors: ch
|
||||
* @LastEditTime: 2022-05-13 14:28:29
|
||||
* @Description: file content
|
||||
*/
|
||||
|
||||
const MSG_TYPE = {
|
||||
// 文本消息
|
||||
TXT: 1,
|
||||
// 语音消息
|
||||
VOICE: 2,
|
||||
// 图片消息
|
||||
IMG: 3,
|
||||
// 视频消息
|
||||
VIDEO: 4,
|
||||
// 自定义类型
|
||||
CUSTOM : 6,
|
||||
// 提示消息
|
||||
TIP : 7
|
||||
}
|
||||
const TYPE = {
|
||||
// 给某个会话发送消息
|
||||
SEND_MSG: 20,
|
||||
// 创建会话
|
||||
CRETAE_SEEION: 21,
|
||||
// 会话心跳
|
||||
SESSION_HEART : 22
|
||||
|
||||
}
|
||||
export {
|
||||
// 消息类型
|
||||
MSG_TYPE
|
||||
}
|
||||
@ -0,0 +1,357 @@
|
||||
export const emojiData = [
|
||||
//笑脸
|
||||
{
|
||||
type: 'smiley',
|
||||
name: '笑脸',
|
||||
list: [
|
||||
'😀',
|
||||
'😁',
|
||||
'😂',
|
||||
'🤣',
|
||||
'😃',
|
||||
'😄',
|
||||
'😅',
|
||||
'😆',
|
||||
'😉',
|
||||
'😊',
|
||||
'😋',
|
||||
'😎',
|
||||
'😍',
|
||||
'😘',
|
||||
'😗',
|
||||
'😙',
|
||||
'😚',
|
||||
'🙂',
|
||||
'🤗',
|
||||
'🤩',
|
||||
'🤔',
|
||||
'🤨',
|
||||
'😐',
|
||||
'😑',
|
||||
'😶',
|
||||
'🙄',
|
||||
'😏',
|
||||
'😣',
|
||||
'😥',
|
||||
'😮',
|
||||
'🤐',
|
||||
'😯',
|
||||
'😪',
|
||||
'😫',
|
||||
'😴',
|
||||
'😌',
|
||||
'😛',
|
||||
'😜',
|
||||
'😝',
|
||||
'🤤',
|
||||
'😒',
|
||||
'😓',
|
||||
'😔',
|
||||
'😕',
|
||||
'🙃',
|
||||
'🤑',
|
||||
'😲',
|
||||
'🙁',
|
||||
'😖',
|
||||
'😞',
|
||||
'😟',
|
||||
'😤',
|
||||
'😢',
|
||||
'😭',
|
||||
'😦',
|
||||
'😧',
|
||||
'😨',
|
||||
'😩',
|
||||
'🤯',
|
||||
'😬',
|
||||
'😰',
|
||||
'😱',
|
||||
'😳',
|
||||
'🤪',
|
||||
'😵',
|
||||
'😡',
|
||||
'😠',
|
||||
'🤬',
|
||||
'😷',
|
||||
'🤒',
|
||||
'🤕',
|
||||
'🤢',
|
||||
'🤮',
|
||||
'🤧',
|
||||
'😇',
|
||||
'🤠',
|
||||
'🤡',
|
||||
'🤥',
|
||||
'🤫',
|
||||
'🤭',
|
||||
'🧐',
|
||||
'🤓',
|
||||
'😈',
|
||||
'👿',
|
||||
'👹',
|
||||
'👺',
|
||||
'💀',
|
||||
'👻',
|
||||
'👽',
|
||||
'🤖',
|
||||
'💩',
|
||||
],
|
||||
},
|
||||
//手势
|
||||
{
|
||||
type: 'gesture',
|
||||
name: '手势',
|
||||
list: [
|
||||
'🤲',
|
||||
'👐',
|
||||
'🙌',
|
||||
'👏',
|
||||
'🤝',
|
||||
'👍',
|
||||
'👎',
|
||||
'👊',
|
||||
'🤛',
|
||||
'🤜',
|
||||
'🤞',
|
||||
'🤟',
|
||||
'🤘',
|
||||
'👌',
|
||||
'👈',
|
||||
'👉',
|
||||
'👆',
|
||||
'👇',
|
||||
'🤚',
|
||||
'🖐',
|
||||
'🖖',
|
||||
'👋',
|
||||
'🤙',
|
||||
'💪',
|
||||
// "🖕",
|
||||
'🙏',
|
||||
],
|
||||
},
|
||||
//人物
|
||||
{
|
||||
type: 'people',
|
||||
name: '人物',
|
||||
list: [
|
||||
'👦',
|
||||
'👧',
|
||||
'👨',
|
||||
'👩',
|
||||
'👴',
|
||||
'👵',
|
||||
'👶',
|
||||
'👱',
|
||||
'👮',
|
||||
'👲',
|
||||
'👳',
|
||||
'👷',
|
||||
'👸',
|
||||
'💂',
|
||||
'🎅',
|
||||
'👰',
|
||||
'👼',
|
||||
'💆',
|
||||
'💇',
|
||||
'🙍',
|
||||
'🙎',
|
||||
'🙅',
|
||||
'🙆',
|
||||
'💁',
|
||||
'🙋',
|
||||
'🙇',
|
||||
'🙌',
|
||||
'🙏',
|
||||
'👤',
|
||||
'👥',
|
||||
'🚶',
|
||||
'🏃',
|
||||
'👯',
|
||||
'💃',
|
||||
'👫',
|
||||
'👬',
|
||||
'👭',
|
||||
'💏',
|
||||
'💑',
|
||||
'👪',
|
||||
],
|
||||
},
|
||||
//动物
|
||||
{
|
||||
type: 'animal',
|
||||
name: '动物',
|
||||
list: [
|
||||
'🙈',
|
||||
'🙉',
|
||||
'🙊',
|
||||
'🐵',
|
||||
'🐒',
|
||||
'🐶',
|
||||
'🐕',
|
||||
'🐩',
|
||||
'🐺',
|
||||
'🐱',
|
||||
'😺',
|
||||
'😸',
|
||||
'😹',
|
||||
'😻',
|
||||
'😼',
|
||||
'😽',
|
||||
'🙀',
|
||||
'😿',
|
||||
'😾',
|
||||
'🐈',
|
||||
'🐯',
|
||||
'🐅',
|
||||
'🐆',
|
||||
'🐴',
|
||||
'🐎',
|
||||
'🐮',
|
||||
'🐂',
|
||||
'🐃',
|
||||
'🐄',
|
||||
'🐷',
|
||||
'🐖',
|
||||
'🐗',
|
||||
'🐽',
|
||||
'🐏',
|
||||
'🐑',
|
||||
'🐐',
|
||||
'🐪',
|
||||
'🐫',
|
||||
'🐘',
|
||||
'🐭',
|
||||
'🐁',
|
||||
'🐀',
|
||||
'🐹',
|
||||
'🐰',
|
||||
'🐇',
|
||||
'🐻',
|
||||
'🐨',
|
||||
'🐼',
|
||||
'🐾',
|
||||
'🐔',
|
||||
'🐓',
|
||||
'🐣',
|
||||
'🐤',
|
||||
'🐥',
|
||||
'🐦',
|
||||
'🐧',
|
||||
'🐸',
|
||||
'🐊',
|
||||
'🐢',
|
||||
'🐍',
|
||||
'🐲',
|
||||
'🐉',
|
||||
'🐳',
|
||||
'🐋',
|
||||
'🐬',
|
||||
'🐟',
|
||||
'🐠',
|
||||
'🐡',
|
||||
'🐙',
|
||||
'🐚',
|
||||
'🐌',
|
||||
'🐛',
|
||||
'🐜',
|
||||
'🐝',
|
||||
'🐞',
|
||||
'🦋',
|
||||
'🐁',
|
||||
'🐂',
|
||||
'🐅',
|
||||
'🐇',
|
||||
'🐉',
|
||||
'🐍',
|
||||
'🐎',
|
||||
'🐐',
|
||||
'🐒',
|
||||
'🐓',
|
||||
'🐕',
|
||||
'🐖',
|
||||
],
|
||||
},
|
||||
//其他
|
||||
{
|
||||
type: 'other',
|
||||
name: '其他',
|
||||
list: [
|
||||
'🌹',
|
||||
'🍀',
|
||||
'🍎',
|
||||
'💰',
|
||||
'📱',
|
||||
'🌙',
|
||||
'🍁',
|
||||
'🍂',
|
||||
'🍃',
|
||||
'🌷',
|
||||
'💎',
|
||||
'🔪',
|
||||
'🔫',
|
||||
'🏀',
|
||||
'👄',
|
||||
'👍',
|
||||
'🔥',
|
||||
'💘',
|
||||
'💓',
|
||||
'💔',
|
||||
'💕',
|
||||
'💖',
|
||||
'💗',
|
||||
'💙',
|
||||
'💚',
|
||||
'💛',
|
||||
'💜',
|
||||
'💝',
|
||||
'💞',
|
||||
'💟',
|
||||
],
|
||||
},
|
||||
];
|
||||
//emoji表情编码
|
||||
export function utf16toEntities(str) {
|
||||
const patt = /[\ud800-\udbff][\udc00-\udfff]/g; // 检测utf16字符正则
|
||||
str = str.replace(patt, (char) => {
|
||||
let H;
|
||||
let L;
|
||||
let code;
|
||||
let s;
|
||||
|
||||
if (char.length === 2) {
|
||||
H = char.charCodeAt(0); // 取出高位
|
||||
L = char.charCodeAt(1); // 取出低位
|
||||
code = (H - 0xd800) * 0x400 + 0x10000 + L - 0xdc00; // 转换算法
|
||||
s = `&#${code};`;
|
||||
} else {
|
||||
s = char;
|
||||
}
|
||||
|
||||
return s;
|
||||
});
|
||||
|
||||
return str;
|
||||
}
|
||||
// 表情解码
|
||||
export function entitiestoUtf16(strObj) {
|
||||
const patt = /&#\d+;/g;
|
||||
const arr = strObj.match(patt) || [];
|
||||
|
||||
let H;
|
||||
let L;
|
||||
let code;
|
||||
|
||||
for (let i = 0; i < arr.length; i += 1) {
|
||||
code = arr[i];
|
||||
code = code.replace('&#', '').replace(';', '');
|
||||
// 高位
|
||||
H = Math.floor((code - 0x10000) / 0x400) + 0xd800;
|
||||
// 低位
|
||||
L = ((code - 0x10000) % 0x400) + 0xdc00;
|
||||
code = `&#${code};`;
|
||||
const s = String.fromCharCode(H, L);
|
||||
strObj = strObj.replace(code, s);
|
||||
}
|
||||
return strObj;
|
||||
}
|
||||
@ -1,124 +0,0 @@
|
||||
<!--
|
||||
* @Author: ch
|
||||
* @Date: 2022-03-26 14:32:03
|
||||
* @LastEditors: ch
|
||||
* @LastEditTime: 2022-04-28 23:43:35
|
||||
* @Description: file content
|
||||
-->
|
||||
<template>
|
||||
<view>
|
||||
<view class="msgItem" v-for="item in msgData" :key="item.id">
|
||||
<view class="msgItem--title">
|
||||
<text>{{item.payload.title }} {{item.id}}</text>
|
||||
<text class="msgItem--time">{{item.createTimeStamp}}</text>
|
||||
</view>
|
||||
<view class="msgItem--con">
|
||||
<image class="msgItem--img" src="@/static/message/xt.png" mode="widthFix"/>
|
||||
<view class="msgItem--desc">{{item.payload.content}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-loadmore status="loading" v-if="!msgData.length"/>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {MsbWebSkt, createUUID} from '@/common/utils';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
curSessionData(){
|
||||
return this.$store.state.sessionData.find(i =>i.id == this.$store.state.sessionMsgId)
|
||||
},
|
||||
msgData (){
|
||||
return this.curSessionData ? this.curSessionData.messageList : [];
|
||||
}
|
||||
},
|
||||
|
||||
onReachBottom(){
|
||||
this.getHistoryMsg();
|
||||
},
|
||||
onShow(){
|
||||
if(!this.$store.state.sessionMsgId){
|
||||
this.$Router.back();
|
||||
return false
|
||||
}
|
||||
|
||||
this.getHistoryMsg();
|
||||
this.readMsg();
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 获取历史消息
|
||||
*/
|
||||
getHistoryMsg(){
|
||||
this.loading = true;
|
||||
const lastMsg = this.msgData[this.msgData.length - 1] || {};
|
||||
MsbWebSkt.send({
|
||||
data : JSON.stringify({
|
||||
traceId : createUUID(),
|
||||
traceType : "2",
|
||||
content: {
|
||||
sessionId : this.$store.state.sessionMsgId,
|
||||
topMessageId : lastMsg.id || null
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 已读消息
|
||||
*/
|
||||
readMsg(){
|
||||
MsbWebSkt.send({
|
||||
data : JSON.stringify({
|
||||
traceId : createUUID(),
|
||||
traceType : "6",
|
||||
content: {
|
||||
sessionId : this.$store.state.sessionMsgId
|
||||
}
|
||||
})
|
||||
});
|
||||
// 计算页头消息数
|
||||
const count = this.$store.state.sessionMsgCount - this.curSessionData.unreadCount;
|
||||
// 计算会话列表消息数
|
||||
this.curSessionData.unreadCount = 0;
|
||||
this.$store.commit('SET_SESSION_MSG_COUNT', count)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.msgItem{
|
||||
padding: 40rpx 0 0 40rpx;
|
||||
&--title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 40rpx;
|
||||
font-size: $font-size-lg;
|
||||
color: $color-grey6;
|
||||
}
|
||||
&--time{
|
||||
font-size: $font-size-sm;
|
||||
color: $color-grey4;
|
||||
}
|
||||
&--con{
|
||||
display: flex;
|
||||
border-bottom: 1px solid $color-grey2;
|
||||
padding: 40rpx 0;
|
||||
}
|
||||
&--img{
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
&--desc{
|
||||
width: 455rpx;
|
||||
font-size: $font-size-base;
|
||||
line-height: 39rpx;
|
||||
color: $color-grey5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,100 @@
|
||||
<!--
|
||||
* @Author: ch
|
||||
* @Date: 2022-05-13 15:57:31
|
||||
* @LastEditors: ch
|
||||
* @LastEditTime: 2022-05-14 13:47:05
|
||||
* @Description: file content
|
||||
-->
|
||||
<template>
|
||||
<view class="product" @click="handleDetail">
|
||||
<image class="product--img" :src="goodsInfo.productImageUrl" mode="aspectFit"/>
|
||||
<view class="product--con">
|
||||
<view class="product--con-title">{{goodsInfo.name}}</view>
|
||||
<UiMoney class="product--con-price" :money="goodsInfo.startingPrice" float prefix suffix></UiMoney>
|
||||
</view>
|
||||
<template v-if="position === 'footer'">
|
||||
<UiButton class="product--btn" size="min" type="gradual" @click="send">发送商品</UiButton>
|
||||
<image class="product--close" src="@/static/imxx/close.png" @click="close"/>
|
||||
</template>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import UiButton from '../../../../../components/UiButton.vue'
|
||||
import UiMoney from '../../../../../components/UiMoney.vue'
|
||||
export default {
|
||||
components: { UiMoney, UiButton },
|
||||
props : {
|
||||
goodsInfo : {
|
||||
type : Object,
|
||||
default : ()=>({})
|
||||
},
|
||||
// 显示位置 footer 底部 msg消息框
|
||||
position : {
|
||||
type : String,
|
||||
default : 'footer'
|
||||
}
|
||||
},
|
||||
methods : {
|
||||
send(){
|
||||
this.$emit('send');
|
||||
},
|
||||
close(){
|
||||
this.$emit('close');
|
||||
},
|
||||
handleDetail(){
|
||||
this.$emit('click')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.product {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
position: relative;
|
||||
&--img{
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
&--con{
|
||||
width: 300rpx;
|
||||
margin-left: 30rpx;
|
||||
&-title{
|
||||
font-size: 28rpx;
|
||||
line-height: 36rpx;
|
||||
@include ellipses(2);
|
||||
}
|
||||
&-price{
|
||||
margin-top: 36rpx;
|
||||
}
|
||||
}
|
||||
&--btn{
|
||||
width: 160rpx;
|
||||
padding : 0;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
bottom: 30rpx;
|
||||
}
|
||||
&--close{
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right:30rpx;
|
||||
}
|
||||
}
|
||||
/deep/{
|
||||
.product--con-price{
|
||||
text{
|
||||
color: #FF512B;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.ui-money--price{
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,93 @@
|
||||
<!--
|
||||
* @Author: ch
|
||||
* @Date: 2022-05-14 14:00:14
|
||||
* @LastEditors: ch
|
||||
* @LastEditTime: 2022-05-14 15:57:30
|
||||
* @Description: file content
|
||||
-->
|
||||
<template>
|
||||
<view class="order" @click="handleDetail">
|
||||
<view class="order--status">{{orderInfo.orderStatusDesc}}</view>
|
||||
<view class="order--con">
|
||||
<image class="order--con-img" :src="orderInfo.productImageUrl" mode="aspectFit"/>
|
||||
<view class="order--con-right">
|
||||
<view class="order--con-title">{{orderInfo.productName}}</view>
|
||||
<UiMoney class="order--con-price" :money="orderInfo.payAmount" float prefix suffix></UiMoney>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order--footer">订单编号{{orderInfo.orderNo}}</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import UiButton from '../../../../../components/UiButton.vue'
|
||||
import UiMoney from '../../../../../components/UiMoney.vue'
|
||||
export default {
|
||||
components: { UiMoney, UiButton },
|
||||
props : {
|
||||
orderInfo : {
|
||||
type : Object,
|
||||
default : ()=>({})
|
||||
},
|
||||
// 显示位置 footer 底部 msg消息框
|
||||
position : {
|
||||
type : String,
|
||||
default : 'footer'
|
||||
}
|
||||
},
|
||||
methods : {
|
||||
handleDetail(){
|
||||
this.$Router.push(`/orderDetail?id=${this.orderInfo.orderId}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.order {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
&--status{
|
||||
font-size: 28rpx;
|
||||
padding: 30rpx 0 20rpx 30rpx;
|
||||
}
|
||||
|
||||
&--con{
|
||||
display: flex;
|
||||
padding: 0 30rpx;
|
||||
&-img{
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
&-right{
|
||||
width: 300rpx;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
&-title{
|
||||
font-size: 28rpx;
|
||||
line-height: 36rpx;
|
||||
@include ellipses(2);
|
||||
}
|
||||
&-price{
|
||||
margin-top: 36rpx;
|
||||
}
|
||||
|
||||
}
|
||||
&--footer{
|
||||
color: #999;
|
||||
border-top: 1px solid #eee;
|
||||
padding: 20rpx 30rpx;
|
||||
margin-top: 26rpx;
|
||||
}
|
||||
}
|
||||
/deep/{
|
||||
.order--con-price{
|
||||
text{
|
||||
color: #FF512B;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.ui-money--price{
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 872 B |
|
After Width: | Height: | Size: 306 B |
|
After Width: | Height: | Size: 219 B |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 463 B |
|
After Width: | Height: | Size: 576 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 900 B |
|
After Width: | Height: | Size: 355 B |
|
After Width: | Height: | Size: 795 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 473 B |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 321 B |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 132 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
|
After Width: | Height: | Size: 815 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 404 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |