发送消息不显示bug

pages/mine/im/index-app.scss

@@ -4,89 +4,127 @@
   width: 100%;
 
 }
+
 .status_bar-nobg {
   height: var(--status-bar-height);
   width: 100%;
 
 }
+
 /* 转圈动画 */
-.turn-load{
+.turn-load {
-animation:turnmy 1s linear infinite;      
+  animation: turnmy 1s linear infinite;
 }
-@keyframes turnmy{
+
-0%{-webkit-transform:rotate(0deg);}
+@keyframes turnmy {
-25%{-webkit-transform:rotate(90deg);}
+  0% {
-50%{-webkit-transform:rotate(180deg);}
+    -webkit-transform: rotate(0deg);
-75%{-webkit-transform:rotate(270deg);}
+  }
-100%{-webkit-transform:rotate(360deg);}
+
+  25% {
+    -webkit-transform: rotate(90deg);
+  }
+
+  50% {
+    -webkit-transform: rotate(180deg);
+  }
+
+  75% {
+    -webkit-transform: rotate(270deg);
+  }
+
+  100% {
+    -webkit-transform: rotate(360deg);
+  }
 }
-.one-show{
+
-animation: oneshow 0.8s ease 1;
+.one-show {
+  animation: oneshow 0.8s ease 1;
 }
-@keyframes oneshow{
+
-from{opacity: 0;}
+@keyframes oneshow {
-to{opacity: 1;}
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
 }
-.status_bar-fixed{
+
-height: var(--status-bar-height);
+.status_bar-fixed {
-width: 100%;
+  height: var(--status-bar-height);
-position: fixed;
+  width: 100%;
-background-color: #f1f1f1;
+  position: fixed;
-z-index: 20;
+  background-color: #f1f1f1;
+  z-index: 20;
 }
-.head-dh-my{
+
-display: flex;
+.head-dh-my {
-position: fixed;
+  display: flex;
-justify-content: space-around;
+  position: fixed;
-align-items: flex-end;
+  justify-content: space-around;
-padding-bottom: 10rpx;
+  align-items: flex-end;
-z-index: 15;
+  padding-bottom: 10rpx;
-background-color: #e3e3e3;
+  z-index: 15;
-width: 750rpx;
+  background-color: #e3e3e3;
+  width: 750rpx;
 }
-.border-bom{
+
-    border-bottom:0.5rpx solid #DDDDDD ;
+.border-bom {
+  border-bottom: 0.5rpx solid #DDDDDD;
 }
-.border-red{
+
-         border-bottom:1rpx solid #d33e18;
+.border-red {
+  border-bottom: 1rpx solid #d33e18;
 }
-.border-bom-big{
+
-         border-bottom:8rpx solid #DDDDDD ;
+.border-bom-big {
+  border-bottom: 8rpx solid #DDDDDD;
 }
-.border-bom-white{
+
-         border-bottom:2rpx solid #FFFFFF ;
+.border-bom-white {
+  border-bottom: 2rpx solid #FFFFFF;
 }
-.border-bom-green{
+
-         border-bottom:4rpx solid #f8f9bd;
+.border-bom-green {
+  border-bottom: 4rpx solid #f8f9bd;
 }
-.border-bom-index{
+
-         border-bottom:4rpx solid #27d9b3;
+.border-bom-index {
+  border-bottom: 4rpx solid #27d9b3;
 }
-.padding-left{
+
+.padding-left {
   padding-left: 20rpx;
 }
-.padding-left-top{
+
+.padding-left-top {
   padding-left: 20rpx;
   padding-top: 20rpx;
 }
-.padding-right{
+
+.padding-right {
   padding-right: 20rpx;
 }
-.input-my{
+
+.input-my {
   padding-left: 20rpx;
   border-radius: 40rpx;
   height: 50rpx;
   margin: 10rpx;
 }
-.tb-tag-absolute{
+
+.tb-tag-absolute {
   position: absolute;
   z-index: 5;
   border-radius: 25rpx;
   font-size: 16rpx;
   margin-left: 25rpx;
-    margin-top:-35rpx;
+  margin-top: -35rpx;
 }
-.lk-tag{
+
+.lk-tag {
   height: 50rpx;
   padding: 0 10rpx;
   display: flex;
@@ -99,89 +137,107 @@ width: 750rpx;
 
 
 }
-.tb-tag-my{
+
+.tb-tag-my {
   border-radius: 15rpx;
   font-size: 16rpx;
   margin-left: 5rpx;
 }
-.my-green{
+
+.my-green {
   color: #29c7a5;
 }
-.my-hui{
+
+.my-hui {
   color: #585858;
   font-size: 22rpx;
 }
-.flex-column-center{
+
+.flex-column-center {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }
-.flex-column-between{
+
+.flex-column-between {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
 }
-.flex-column-start{
+
+.flex-column-start {
   display: flex;
   flex-direction: column;
   justify-content: center;
 }
-.flex-column-around{
+
+.flex-column-around {
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   align-items: center;
 
 }
-.flex-row-start{
+
+.flex-row-start {
   display: flex;
   flex-direction: row;
   align-items: center;
 }
-.flex-row-around{
+
+.flex-row-around {
   display: flex;
   flex-direction: row;
   justify-content: space-around;
   align-items: center;
 }
-.flex-row-center{
+
+.flex-row-center {
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
 }
-.flex-row-between{
+
+.flex-row-between {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
 }
-.my-title{
+
+.my-title {
   font-size: 35rpx;
   font-weight: bold;
 }
-.my-neirong{
+
+.my-neirong {
   font-size: 26rpx;
   color: #6d6d6d;
 }
-.my-neirong-sm{
+
+.my-neirong-sm {
   font-size: 23rpx;
   color: #616161;
 }
-.my-tag-text{
+
+.my-tag-text {
   font-size: 22rpx;
   padding-top: 20rpx;
   color: #bababa;
 }
-.padding-top{
+
+.padding-top {
   padding-top: 35rpx;
 }
-.padding-top-sm{
+
+.padding-top-sm {
   padding-top: 20rpx;
 }
-.bottom-dh{
+
+.bottom-dh {
   background-color: #f1f1f1;
   position: fixed;
   z-index: 10;
@@ -189,13 +245,15 @@ width: 750rpx;
   width: 750rpx;
   height: 110rpx;
 }
-.tb-text{
+
+.tb-text {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }
-.bottom-text{
+
+.bottom-text {
   width: 750rpx;
   position: fixed;
   text-align: center;
@@ -203,15 +261,17 @@ width: 750rpx;
   color: #9d9d9d;
   bottom: 70rpx;
 }
-.white-box{
+
+.white-box {
   padding: 0 20rpx;
   margin-bottom: 15rpx;
   margin-top: 5rpx;
   width: 715rpx;
   background-color: #FFFFFF;
   border-radius: 30rpx;
-    }
+}
-.green-box{
+
+.green-box {
   padding: 0 20rpx;
   margin-bottom: 15rpx;
   margin-top: 5rpx;
@@ -219,15 +279,17 @@ width: 750rpx;
   background-color: #FFFFFF;
   border-radius: 30rpx;
   background-image: linear-gradient(#1faf97, #29c7a5);
-   }
+}
-.yuan-sm{
+
+.yuan-sm {
   width: 13rpx;
   height: 13rpx;
   border-radius: 50%;
   background-color: #1fc189;
   margin-left: 10rpx;
 }
-.yuan-normal{
+
+.yuan-normal {
   width: 14rpx;
   height: 14rpx;
   border-radius: 50%;
@@ -235,7 +297,8 @@ width: 750rpx;
   margin-left: 10rpx;
 
 }
-.yuan-normal-red{
+
+.yuan-normal-red {
   width: 14rpx;
   height: 14rpx;
   border-radius: 50%;
@@ -243,74 +306,91 @@ width: 750rpx;
   margin-left: 10rpx;
 
 }
-.yuan-sm-red{
+
+.yuan-sm-red {
   width: 13rpx;
   height: 13rpx;
   border-radius: 50%;
   background-color: #de410d;
   margin-left: 10rpx;
 }
-.white-box-all{
+
+.white-box-all {
   margin-top: 5rpx;
   width: 750rpx;
   background-color: #FFFFFF;
   border-radius: 13px;
 }
-.moneycolor{
+
+.moneycolor {
   color: #ea5002;
 }
-.text-bold-sm{
+
+.text-bold-sm {
   font-weight: 425;
 }
-.sm-moneycolor{
+
+.sm-moneycolor {
   color: #e3793b;
 }
-.margin-top{
+
+.margin-top {
   margin-top: 20rpx;
 }
-.margin-top-sm{
+
+.margin-top-sm {
   margin-top: 12rpx;
 }
-.margin{
+
+.margin {
   margin: 20rpx;
 }
-.margin-left{
+
+.margin-left {
   margin-left: 20rpx;
 }
-.margin-left-top{
+
+.margin-left-top {
   margin-left: 20rpx;
   margin-top: 20rpx;
 }
-.margin-right{
+
+.margin-right {
   margin-right: 20rpx;
 }
-.my-absolute{
+
+.my-absolute {
   position: absolute;
- }
+}
- .my-fixed{
+
+.my-fixed {
   position: fixed;
- }
+}
-.my-seach{
+
+.my-seach {
   width: 450rpx;
   height: 55rpx;
   background-color: #f8f8f8;
   border-radius: 30rpx;
   padding-left: 20rpx;
 }
-.move-view{
+
+.move-view {
   width: 48rpx;
   height: 10rpx;
   background-color: #28ba91;
   border-radius: 4rpx;
   margin-left: 100rpx;
 }
-.move-view-p{
+
+.move-view-p {
   width: 45rpx;
   height: 10rpx;
   background-color: #28ba91;
   border-radius: 4rpx;
 }
-.header-dh{
+
+.header-dh {
   position: fixed;
   padding-top: 20rpx;
   padding-bottom: 15rpx;
@@ -319,18 +399,24 @@ width: 750rpx;
   background-color: #f1f1f1;
   z-index: 20;
 }
-.tp-normal{
+
+.tp-normal {
   width: 60rpx;
   height: 60rpx;
-}.tp-sm{
+}
+
+.tp-sm {
   width: 45rpx;
   height: 45rpx;
-}.tp-big{
+}
+
+.tp-big {
   width: 70rpx;
   height: 70rpx;
   border-radius: 50%;
 }
-.main-color{
+
+.main-color {
   color: #07D188;
 }
 
@@ -1583,7 +1669,7 @@ width: 750rpx;
 /* ==================
         初始化
  ==================== */
- body {
+body {
   background-color: #f1f1f1;
   font-size: 28upx;
   color: #333333;
@@ -1605,9 +1691,11 @@ image {
 .round {
   border-radius: 5000rpx;
 }
-.radius-m{
+
+.radius-m {
   border-radius: 12rpx;
 }
+
 .radius {
   border-radius: 6rpx;
 }
@@ -4080,11 +4168,13 @@ button.cuIcon.lg {
 .cu-modal.drawer-modal.show .cu-dialog {
   transform: translateX(0%);
 }
-.cu-modal .cu-dialog>.cu-bar:first-child .action{
+
+.cu-modal .cu-dialog>.cu-bar:first-child .action {
   min-width: 100rpx;
   margin-right: 0;
   min-height: 100rpx;
 }
+
 /* ==================
          轮播
  ==================== */
@@ -4514,11 +4604,13 @@ scroll-view.cu-steps .cu-item {
   position: relative;
   overflow: hidden;
 }
+
 .grid.grid-square>view.bg-img image {
   width: 100%;
   height: 100%;
   position: absolute;
 }
+
 .grid.col-1.grid-square>view {
   padding-bottom: 100%;
   height: 0;
@@ -4995,11 +5087,12 @@ scroll-view.cu-steps .cu-item {
   color: #ffffff;
 }
 
-.bg-user-orang{
+.bg-user-orang {
   background-color: #FFFFCC;
   color: black;
 }
-.bg-to-color{
+
+.bg-to-color {
   background-color: #F5F5F5;
   color: black;
 }
@@ -5469,8 +5562,8 @@ scroll-view.cu-steps .cu-item {
   color: #0081ff;
 }
 
-.text-hui{
+.text-hui {
-	color:#787878;
+  color: #787878;
 }
 
 .text-purple,
@@ -5529,60 +5622,61 @@ scroll-view.cu-steps .cu-item {
  */
 
 /* css 滤镜 控制黑白底色gif的 */
-.gif-black{  
+.gif-black {
   mix-blend-mode: screen;
-  }
+}
-  .gif-white{  
+
+.gif-white {
   mix-blend-mode: multiply;
-  }
+}
 
 
-  /* Animation css */
+/* Animation css */
-  [class*=animation-] {
+[class*=animation-] {
   animation-duration: .5s;
   animation-timing-function: ease-out;
   animation-fill-mode: both
-  }
+}
 
-  .animation-fade {
+.animation-fade {
   animation-name: fade;
   animation-duration: .8s;
   animation-timing-function: linear
-  }
+}
 
-  .animation-scale-up {
+.animation-scale-up {
   animation-name: scale-up
-  }
+}
 
-  .animation-scale-down {
+.animation-scale-down {
   animation-name: scale-down
-  }
+}
 
-  .animation-slide-top {
+.animation-slide-top {
   animation-name: slide-top
-  }
+}
 
-  .animation-slide-bottom {
+.animation-slide-bottom {
   animation-name: slide-bottom
-  }
+}
 
-  .animation-slide-left {
+.animation-slide-left {
   animation-name: slide-left
-  }
+}
 
-  .animation-slide-right {
+.animation-slide-right {
   animation-name: slide-right
-  }
+}
 
-  .animation-shake {
+.animation-shake {
   animation-name: shake
-  }
+}
 
-  .animation-reverse {
+.animation-reverse {
   animation-direction: reverse
-  }
+}
 
-  @keyframes fade {
+@keyframes fade {
   0% {
     opacity: 0
   }
@@ -5590,9 +5684,9 @@ scroll-view.cu-steps .cu-item {
   100% {
     opacity: 1
   }
-  }
+}
 
-  @keyframes scale-up {
+@keyframes scale-up {
   0% {
     opacity: 0;
     transform: scale(.2)
@@ -5602,9 +5696,9 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: scale(1)
   }
-  }
+}
 
-  @keyframes scale-down {
+@keyframes scale-down {
   0% {
     opacity: 0;
     transform: scale(1.8)
@@ -5614,9 +5708,9 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: scale(1)
   }
-  }
+}
 
-  @keyframes slide-top {
+@keyframes slide-top {
   0% {
     opacity: 0;
     transform: translateY(-100%)
@@ -5626,9 +5720,9 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: translateY(0)
   }
-  }
+}
 
-  @keyframes slide-bottom {
+@keyframes slide-bottom {
   0% {
     opacity: 0;
     transform: translateY(100%)
@@ -5638,9 +5732,9 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: translateY(0)
   }
-  }
+}
 
-  @keyframes shake {
+@keyframes shake {
 
   0%,
   100% {
@@ -5682,9 +5776,9 @@ scroll-view.cu-steps .cu-item {
   90% {
     transform: translateX(-1px)
   }
-  }
+}
 
-  @keyframes slide-left {
+@keyframes slide-left {
   0% {
     opacity: 0;
     transform: translateX(-100%)
@@ -5694,9 +5788,9 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: translateX(0)
   }
-  }
+}
 
-  @keyframes slide-right {
+@keyframes slide-right {
   0% {
     opacity: 0;
     transform: translateX(100%)
@@ -5706,4 +5800,4 @@ scroll-view.cu-steps .cu-item {
     opacity: 1;
     transform: translateX(0)
   }
-  }
+}

pages/mine/im/index.vue

@@ -25,7 +25,6 @@
                 <view v-else>
                   <view class="goodsCard u-flex u-row-between u-p-b-0" style="width:100%;margin: 0 0; ">
                     <view class="imagebox" @click="jumpGoodDelic">
-                      <!-- <image class="image" :src="goodLiistData.thumbnail" mode="widthFix"></image> -->
                       <image class="image" :src="JSON.parse(item.text).thumbnail" mode="widthFix"></image>
                     </view>
                     <view class="goodsdesc" @click="jumpGoodDelic">
@@ -292,7 +291,7 @@ export default {
         talk_id: this.params.talkId,
       }
       this.ws.send(JSON.stringify(msg))
-      this.msgList.push({ "text": JSON.stringify(this.goodLiistData), "my": true })
+      this.msgList.push({ "text": JSON.stringify(this.goodLiistData), "my": true, "messageType": 'GOODS' })
       this.showHide = false
       storage.setImGoodsLink(this.params.talkId)
     },
@@ -390,7 +389,7 @@ export default {
         talk_id: this.params.talkId,
       }
       this.ws.send(JSON.stringify(msg))
-      this.msgList.push({ "text": this.msg, "my": true })
+      this.msgList.push({ "text": this.msg, "my": true, "messageType": 'MESSAGE' })
       // 保证消息可见
       let type = 'down';
       this.msgGo(type)