From 4efeb31d5b4921d7e851c256009486ad86bc70e2 Mon Sep 17 00:00:00 2001
From: zengh <123456>
Date: Tue, 21 Jun 2022 09:14:57 +0800
Subject: [PATCH] 地址替换
---
pages/groupChat/chating.vue | 613 +++++++++++++++++++++++++++++-------------------------
1 files changed, 329 insertions(+), 284 deletions(-)
diff --git a/pages/groupChat/chating.vue b/pages/groupChat/chating.vue
index bd837b0..802467a 100644
--- a/pages/groupChat/chating.vue
+++ b/pages/groupChat/chating.vue
@@ -1,199 +1,212 @@
<template>
- <view class="content">
-
- <!-- 头部 -->
- <view class="top-bar">
- <view class="top-bar-left" @tap="backOne()">
- <view class="back-img">
- <image src="@/static/images/common/back.png" />
- </view>
- </view>
- <view class="top-bar-center title">
- <text>{{ recName }}</text>
- </view>
- <view class="top-bar-right search pice">
- <view class="group-img">
- <image :src=recAvatar
- mode=""/>
- </view>
- </view>
- </view>
-
- <scroll-view 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"
- :animation="animationData"/>
- </view>
- <view class="chat-ls" v-for="(item, index) in msgs"
- :key="index"
- :id="'msg' + item.id">
- <view class="chat-time" v-if="item.postTime != ''">{{ item.postTime | Msgdate }}</view>
-
- <view class="msg-m msg-left" v-if="item.senderId != senId">
- <image :src= recAvatar
- mode=""
- class="user-img" />
- <!-- text -->
- <view class="message" v-if="item.messageType == 0">
- <view class="msg-text">{{ item.postMessage }}</view>
- </view>
- <!-- image -->
- <view class="message" v-if="item.messageType == 1">
- <image :src="item.postMessage"
- class="msg-img"
- mode="widthFix"
- @tap="previewImage(item.postMessage)"/>
- </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)">
- <image src="../../static/images/chatroom/sound.png"
- mode=""
- class="voice-img"/>
- {{ item.postMessage.time }} "
- </view>
- </view>
- <!-- location -->
- <view class="message" v-if="item.messageType == 3">
- <view class="msg-map"
- @tap="openLocation(item.postMessage)">
- <view class="map-name">{{ item.postMessage.name }}</view>
- <view class="map-address">{{ item.postMessage.address }}</view>
- <image src="../../static/images/chatroom/map.jpg"
- mode="aspectFit"
- class="map-img"/>
- </view>
- </view>
-
+ <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' }" :placeholder="true" title-color="#fff">
+
+ <!-- <view slot='right'>
+ <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">
+ <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"
+ :animation="animationData" />
</view>
-
- <view class="msg-m msg-right" v-if="item.senderId == senId">
- <image :src= senAvatar
- mode=""
- class="user-img" />
- <view class="message" v-if="item.messageType == 0">
- <view class="msg-text">{{ item.postMessage }}</view>
- </view>
- <view class="message" v-if="item.messageType == 1">
- <image :src="item.postMessage"
- class="msg-img"
- mode="widthFix"
- @tap="previewImage(item.postMessage)"/>
- </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 }} "
- <image src="@/static/images/chatroom/sound.png"
- mode=""
- class="voice-img"/>
+ <view class="chat-ls" v-for="(item, index) in msgs" :key="index" :id="'msg' + item.id">
+ <view class="chat-time" v-if="item.postTime != ''">{{ item.postTime | Msgdate }}</view>
+
+ <view class="msg-m msg-left" v-if="item.senderId != senId">
+ <image :src=recAvatar mode="" class="user-img" />
+ <!-- text -->
+ <view class="message" v-if="item.messageType == 0">
+ <view class="msg-text">{{ item.postMessage }}</view>
</view>
+ <!-- image -->
+ <view class="message" v-if="item.messageType == 1">
+ <image :src="item.postMessage" class="msg-img" mode="widthFix"
+ @tap="previewImage(item.postMessage)" />
+ </view>
+ <!-- voice -->
+ <view class="message" v-if="item.messageType == 2">
+ <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 60 + 'px'}"
+ @tap="playVoice(item.postMessage)">
+
+ <image src="../../static/images/chatroom/sound.png" mode="" class="voice-img" />
+ {{ item.postMessage.time }}"
+
+ </view>
+ </view>
+ <!-- location -->
+ <view class="message" v-if="item.messageType == 3">
+ <view class="msg-map" @tap="openLocation(item.postMessage)">
+ <view class="map-name">{{ item.postMessage.name }}</view>
+ <view class="map-address">{{ item.postMessage.address }}</view>
+ <image src="../../static/images/chatroom/map.jpg" mode="aspectFit" class="map-img" />
+ </view>
+ </view>
+
</view>
- <!-- location -->
- <view class="message" v-if="item.messageType == 3">
- <view class="msg-map"
- @tap="openLocation(item.postMessage)">
- <view class="map-name">{{ item.postMessage.name }}</view>
- <view class="map-address">{{ item.postMessage.address }}</view>
- <!-- <map class="map"
+
+ <view class="msg-m msg-right" v-if="item.senderId == senId">
+ <image :src=senAvatar mode="" class="user-img" />
+ <view class="message" v-if="item.messageType == 0">
+ <view class="msg-text">{{ item.postMessage }}</view>
+ </view>
+ <view class="message" v-if="item.messageType == 1">
+ <image :src="item.postMessage" class="msg-img" mode="widthFix"
+ @tap="previewImage(item.postMessage)" />
+ </view>
+ <!-- voice -->
+ <view class="message" v-if="item.messageType == 2">
+ <view class="msg-text voice" :style="{width:item.postMessage.time * 4 + 60 + 'px'}"
+ @tap="playVoice(item.postMessage)">
+ {{ item.postMessage.time }}"
+ <image src="@/static/images/chatroom/sound.png" mode="" class="voice-img" />
+ </view>
+ </view>
+ <!-- location -->
+ <view class="message" v-if="item.messageType == 3">
+ <view class="msg-map" @tap="openLocation(item.postMessage)">
+ <view class="map-name">{{ item.postMessage.name }}</view>
+ <view class="map-address">{{ item.postMessage.address }}</view>
+ <!-- <map class="map"
:latitude="item.postMessage.latitude"
:longitude="item.postMessage.longitude"
:markers="covers(item.postMessage)"/> -->
- <image src="../../static/images/chatroom/map.jpg"
- mode="aspectFit"
- class="map-img"/>
+ <image src="../../static/images/chatroom/map.jpg" mode="aspectFit" class="map-img" />
+ </view>
</view>
</view>
+
+
</view>
-
-
+
</view>
-
- </view>
- <!-- <view class="padbt"></view> -->
- </scroll-view>
- <submit @inputs="inputs" :names="name"
- @heights="heights"/>
+
+ </scroll-view>
+ <submit @inputs="inputs" :names="name" :callname="callName" @heights="heights" />
</view>
</template>
<script>
- import datas from '@/debugdate/debugdate.js'
+ import datas from '@/debugdate/debugdate.js'
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() {
return {
+ swiperHeight: 0,
msgs: [],
imgMsg: [],
oldTime: new Date(),
scrollToView: '',
- inputh: '72',
- recipientId: null,//接收者id
- recAvatar: null,//接收者头像
- recName: null,//接收者姓名
- senAvatar:null,//发送者头像
- senId: null,//接收者id
+ inputh: '72',
+ recipientId: null, //接收者id
+ recAvatar: null, //接收者头像
+ recName: null, //接收者姓名
+ senAvatar: null, //发送者头像
+ senId: null, //接收者id
getData: null,
- animationData: {}, // 动画
- nowpage: 0, // 页码
- loading: '', // 滚动事件
+ animationData: {}, // 动画
+ nowpage: 0, // 页码
+ loading: '', // 滚动事件
isload: true,
isanimation: true,
begainloading: true,
-
- name: []//视频 双方id
+
+ name: [], //视频 双方id
+ innerAudioContext: uni.createInnerAudioContext()
};
},
- components:{
+ components: {
submit,
},
onLoad(option) {
this.recipientId = option.chatID;
this._getMsg(this.nowpage)
// this.nextPage()
- var data = JSON.parse(option.data)
- console.log(data,55555555555555555555555)
- this.name = ['wo',data.id];
+ var data = option.data
+
+ if (this.isJSON(option.data) == true) {
+ data = JSON.parse(option.data)
+
+ }
+
+ this.name = ['wo', option.chatID];
+ if (typeof data.recipientName == "undefined") {
+ this.callName = data.realName;
+ } else {
+ this.callName = data.recipientName;
+ }
+
},
- methods:{
+
+ onReady() {
+ let that = this;
+ uni.getSystemInfo({
+ success(e) {
+ let {
+ windowWidth,
+ windowHeight,
+ safeArea
+ } = e;
+ const query = uni.createSelectorQuery().in(that);
+ query
+ .select('#chatingBox')
+ .boundingClientRect(data => {
+
+ that.swiperHeight = (safeArea.bottom - data.top);
+
+ })
+ .exec();
+ }
+ });
+ },
+
+ onUnload() {
+ var innerAudioContext = this.innerAudioContext = uni.createInnerAudioContext()
+
+ innerAudioContext.destroy()
+ },
+
+ methods: {
+ chatMessageDetail() {
+
+ },
+
// 返回键
backOne() {
uni.navigateBack({
delta: 1
})
},
+
// 滚动顶部加载上一页
nextPage() {
// if(this.nowpage > 0 && this.begainloading) {
// // 出现loading icon
// this.isload = false
// this.begainloading = false
-
+
// var animation = uni.createAnimation({
// duration: 1000,
// timingFunction: 'step-start'
// })
-
+
// this.animation = animation
-
-
+
+
// let i = 1
// this.loading = setInterval(function() {
// animation.rotate(i * 30).step()
@@ -203,77 +216,85 @@
// if(i > 40) {
// this._getMsg(this.nowpage)
// }
-
+
// }.bind(this), 100)
// }
-
-
+
+
},
// 获取聊天数据
_getMsg(page) {
var that = this;
that.senId = WxStorage.get("ids");
uni.request({
- url:"http://223.82.109.183:2082/api/chat-records/getSingleMessagePage",
- method:"get",
- data:{
+ url: this.$store.state.piAPI + "/chat-records/getSingleMessagePage",
+ method: "get",
+ data: {
senderId: that.senId,
recipientId: that.recipientId
// recipientId: "1370571848600920066"
},
- success:(res)=> {
+ success: (res) => {
// recAvatar: null,//接收者头像
// senAvatar:null,//发送者头像
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 = "http://s16s652780.51mypc.cn/img/bg/img-logo.png";
+ 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";
}
-
- if(resdata[i].id == that.senId){
+
+ if (resdata[i].id == that.senId) {
that.senAvatar = resdata[i].avatar;
- }else{
+ } else {
that.recAvatar = resdata[i].avatar;
that.recName = resdata[i].realName;
}
+
}
let msg = res.data.data.chatRecordsIPage
that.getData = msg;
// 页数加1
//let msg = datas.message()
let maxpages = msg.length
- if(msg.length > (page + 1) * 10) {
+ if (msg.length > (page + 1) * 10) {
maxpages = (page + 1) * 10
that.nowpage++
- }else {
+ } else {
// 数据获取完毕
that.nowpage = -1
}
// 数据分页加载 每十条为一页
- for(var i = 0; i < msg.length; i++){
- msg[i].imgUrl = '../../static/images/index/friend-list/'+msg[i].imgUrl
+ for (var i = 0; i < msg.length; i++) {
+ msg[i].imgUrl = '../../static/images/index/friend-list/' + msg[i].imgUrl
// 时间间隔
- if(i < msg.length-1){
+ if (i < msg.length - 1) {
let t = filter.spaceTime(that.oldTime, msg[i].postTime)
- if(t){
+ if (t) {
that.oldTime = t
}
msg[i].postTime = t
}
// 补充图片地址
- if(msg[i].types == 1){
- msg[i].message = '../../static/images/index/friend-list/'+msg[i].message
+ if (msg[i].types == 1) {
+ 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])
+
}
-
+
that.$nextTick(() => {
that.isanimation = false
- if(that.getData.length != 0){
+ if (that.getData.length != 0) {
that.scrollToView = 'msg' + that.getData[0].id
}
-
+
})
// 数据加载完毕关闭动画，停止数据加载
clearInterval(this.loading)
@@ -281,17 +302,36 @@
this.isload = true
// 开启加载
this.begainloading = true
-
+
}
})
-
+
},
+
+ 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) {
-
+
let index = 0
- for(var i =0; i < this.imgMsg.length; i++){
- if(this.imgMsg[i] == e) {
+ for (var i = 0; i < this.imgMsg.length; i++) {
+ if (this.imgMsg[i] == e) {
index = i
}
}
@@ -301,29 +341,36 @@
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
+
+ var innerAudioContext = this.innerAudioContext = uni.createInnerAudioContext()
+ // innerAudioContext.autoplay = false
+ innerAudioContext.src = e.voice
innerAudioContext.play()
+
+ setTimeout(() => {
+ innerAudioContext.destroy()
+ }, e.time * 1000)
+
},
// 接收输入内容
inputs(e) {
var that = this;
this.isanimation = true
- let len = this.msgs.length -1
- let nowTime = new Date();
+ let len = this.msgs.length - 1
+ let nowTime = new Date();
var sentTime = that.dateFormat("YYYY-mm-dd HH:MM:SS", nowTime);
let t = filter.spaceTime(this.oldTime, nowTime)
- if(t){
+ if (t) {
this.oldTime = t
}
nowTime = t
@@ -331,32 +378,44 @@
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:"http://223.82.109.183:2082/api/chat-records/insertSingleChat",
- method:"post",
- data:{
+ url: this.$store.state.piAPI + "/chat-records/insertSingleChat",
+ method: "post",
+ data: {
senderId: that.senId,
recipientId: that.recipientId,
- postMessage: e.message,
- messageType: 0,
+ postMessage: mesagess,
+ messageType: e.types,
status: 0,
postTime: sentTime,
},
- success:(res)=> {
-
+ success: (res) => {
+
+
}
});
-
+
this.msgs.push(sendMsg)
+
+ console.log(this.msgs, 789)
+
this.$nextTick(() => {
this.scrollToView = 'msg' + len
})
- if(e.types == 1) {
+ if (e.types == 1) {
this.imgMsg.push(e.message)
}
},
@@ -364,29 +423,26 @@
heights(e) {
this.inputh = e
this.goBottom()
- // console.log('高度' + e)
},
// 滚动到底部
goBottom() {
this.isanimation = true
this.scrollToView = ''
this.$nextTick(() => {
- let len = this.getData.length -1
- if(this.getData.length != 0){
+ let len = this.getData.length - 1
+ if (this.getData.length != 0) {
this.scrollToView = 'msg' + this.getData[0].id
}
-
+
})
},
// 地图定位
covers(e) {
- let map = [
- {
- latitude: e.latitude,
- longitude: e.longitude,
- iconPath: '../../static/images/chatroom/placeholder-r.png'
- }
- ]
+ let map = [{
+ latitude: e.latitude,
+ longitude: e.longitude,
+ iconPath: '../../static/images/chatroom/placeholder-r.png'
+ }]
return (map)
},
// 导航
@@ -397,96 +453,78 @@
name: e.name,
address: e.address,
success: () => {
- console.log('success')
+ // console.log('success')
}
})
},
//时间格式化
dateFormat(fmt, date) {
- let ret;
- const opt = {
- "Y+": date.getFullYear().toString(), // 年
- "m+": (date.getMonth() + 1).toString(), // 月
- "d+": date.getDate().toString(), // 日
- "H+": date.getHours().toString(), // 时
- "M+": date.getMinutes().toString(), // 分
- "S+": date.getSeconds().toString() // 秒
- // 有其他格式化字符需求可以继续添加，必须转化成字符串
- };
- for (let k in opt) {
- ret = new RegExp("(" + k + ")").exec(fmt);
- if (ret) {
- fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
- };
- };
- return fmt;
+ let ret;
+ const opt = {
+ "Y+": date.getFullYear().toString(), // 年
+ "m+": (date.getMonth() + 1).toString(), // 月
+ "d+": date.getDate().toString(), // 日
+ "H+": date.getHours().toString(), // 时
+ "M+": date.getMinutes().toString(), // 分
+ "S+": date.getSeconds().toString() // 秒
+ // 有其他格式化字符需求可以继续添加，必须转化成字符串
+ };
+ for (let k in opt) {
+ ret = new RegExp("(" + k + ")").exec(fmt);
+ if (ret) {
+ fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
+ };
+ };
+ return fmt;
}
},
- filters:{
+ filters: {
Msgdate(time) {
- return filter.Msgdate(time)
+ return filter.Msgdate(time)
}
}
}
-
</script>
-<style lang="scss">
+<style lang="scss">
@import '../../static/scss/index.scss';
- .padbt {
- height: var(--status-bar-height);
- width: 100%;
- }
- page {
- height: 100%;
- }
+
.content {
height: 100%;
background: rgba(244, 244, 244, 1);
// background: #2C405A;
}
-
- .top-bar {
- background: rgba(244, 244, 244, .96);
- // box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .1);
- border-bottom: 1px solid $uni-border-color;
-
- .group-img {
- image{
- position: absolute;
- bottom: 10rpx;
- right: $uni-spacing-col-base;
- width: 68rpx;
- height: 68rpx;
- border-radius: 16rpx;
- // justify-content: center;
- }
- }
+
+ .set-icon {
+ vertical-align: middle;
+ width: 41rpx;
+ height: auto;
+ margin-right: 35rpx;
}
.chat {
height: 100%;
-
+
.chat-main {
padding-left: $uni-spacing-col-base;
padding-right: $uni-spacing-col-base;
- padding-top: 100rpx;
+ padding-top: 16rpx;
// padding-bottom: 120rpx;
display: flex;
flex-direction: column;
-
+
.loading {
text-align: center;
-
+
.loading-img {
width: 60rpx;
height: 60rpx;
}
}
}
-
+
.chat-ls {
-
+
.chat-time {
font-size: $uni-font-size-base;
color: rgba(39, 40, 50, .6);
@@ -494,56 +532,59 @@
padding: 20rpx 0;
text-align: center;
}
-
+
.msg-m {
display: flex;
padding: 20rpx 0;
-
+
.user-img {
flex: none;
- width: 88upx;;
- height: 88upx;;
+ width: 88upx;
+ ;
+ height: 88upx;
+ ;
border-radius: $uni-border-radius-base;
}
-
+
.message {
flex: none;
max-width: 480rpx;
-
+
}
-
+
.msg-text {
font-size: $uni-font-size-lg;
color: $uni-text-color;
line-height: 44rpx;
- padding: 18rpx 34rpx;
+ padding: 18rpx 20rpx;
}
-
+
.msg-img {
border-radius: $uni-border-radius-base;
max-width: 400rpx;
}
-
+
.voice {
width: 200rpx;
min-width: 110rpx;
max-width: 400rpx;
-
+
.voice-img {
width: 20px;
height: 40rpx;
top: 2rpx;
// padding-top: -8rpx;
}
-
+
}
+
// 陶 我想你
.msg-map {
background: #fff;
width: 464rpx;
height: 284rpx;
overflow: hidden;
-
+
.map-name {
font-size: $uni-font-size-lg;
color: $uni-text-color;
@@ -554,7 +595,7 @@
-webkit-line-clamp: 1;
overflow: hidden;
}
-
+
.map-address {
font-size: $uni-font-size-sm;
color: $uni-text-color-disable;
@@ -564,14 +605,14 @@
-webkit-line-clamp: 1;
overflow: hidden;
}
-
+
// .map {
// padding-top: 8rpx;
// width: 464rpx;
// height: 190rpx;
// overflow: hidden;
// }
-
+
.map-img {
width: 464rpx;
// padding-top: 8rpx;
@@ -579,67 +620,71 @@
// top: -70rpx;
}
}
-
+
}
+
.msg-left {
flex-direction: row;
+
.msg-text {
margin-left: 16rpx;
- background-color: #fff;
border-radius: 0 20rpx 20rpx 20rpx;
+ background-color: rgba(255, 170, 0, 0.8);
}
-
+
.msg-img {
padding-left: 16rpx;
}
-
+
.msg-map {
margin-left: 16rpx;
border-radius: 0 20rpx 20rpx 20rpx;
}
-
+
.voice {
text-align: right;
-
+
.voice-img {
- float: left;
+ float: left;
}
-
+
}
-
+
}
-
+
.msg-right {
flex-direction: row-reverse;
+
.msg-text {
margin-right: 16rpx;
background-color: rgba(255, 228, 49, .8);
border-radius: 20rpx 0rpx 20rpx 20rpx;
}
-
+
.msg-img {
padding-right: 16rpx;
}
-
+
.msg-map {
margin-right: 16rpx;
border-radius: 20rpx 0rpx 20rpx 20rpx;
}
-
+
.voice {
text-align: left;
-
+
.voice-img {
float: right;
- transform: rotate(180deg);
+ transform: rotate(180deg);
}
-
+
}
-
+
}
}
-
+
}
+
.displaynone {
display: none;
}
--
Gitblit v1.9.3