优化

pages/Home/Home.vue

@@ -257,7 +257,7 @@ export default {
         this.info = res.data;
         console.log("userinfo", this.info);
         counter.$patch({ myitem: this.info });
-        goEasylogin(this.$goeasy, String(this.info.id), this.info.headerIcon, this.info.nickName)//登录IM
+          goEasylogin(this.$goeasy, String(this.info.id), this.info.headerIcon, this.info.nickName)//登录IM 
       },
     });
     // setTimeout(() => {
@@ -472,6 +472,7 @@ export default {
         data: {
           id: item.id,
           userId: this.info.id,
+          from: 1,
         },
         userInfo: true,
       });

pages/Mine/Mine.vue

@@ -170,7 +170,7 @@
                 胜利
               </view>
               <view class="Session"> 共{{ item.pkNumber }}场 </view>
-              <view class="Time">{{ TimeFormatting(item.pkTime) }}</view>
+              <view class="Time">{{ TimeFormatting(item.pkTime*1000) }}</view>
             </view>
             <view v-if="myPkRecorddata.length === 0" class="no-content">暂无内容</view>
           </view>
@@ -390,6 +390,7 @@ export default {
       }).then((res) => {
         if (res.code == 200) {
           this.myPkRecorddata = res.data;
+          console.log("this.myPkRecorddatathis.myPkRecorddatathis.myPkRecorddatathis.myPkRecorddata",JSON.stringify(this.myPkRecorddata));
         } else {
           console.log(res.msg);
         }

pages/Mine/minecomponents/DetailsPKRecords/DetailsPKRecords.vue

@@ -35,10 +35,9 @@
           <view class="AnchorAinfo">
             <view class="AnchorAname"> {{ item.anchorIdA }} </view>
             <view class="AnchorATime">{{ formatDate(item.pkTime) }}</view>
-            <!-- <view class="AnchorAICon" v-if="item.userACoins !== null"> -->
-            <view class="AnchorAICon">
+            <view class="AnchorAICon" v-if="item.userACoins !== null">
               <view class="AnchorAIContext">实际打金币:</view>
-              <view class="AnchorAIConNum">{{ formatCoinNum(iconNumber) }}</view>
+              <view class="AnchorAIConNum">{{ formatCoinNum(item.userACoins) }}</view>
             </view>
           </view>
         </view>
@@ -122,8 +121,6 @@ export default {
       item: {},
       coinNumlist: [],
       triggered: false,
-
-      iconNumber: 123457,
     };
   },
   onLoad(options) {

pages/Mine/minecomponents/pkRecord.vue

@@ -1,10 +1,18 @@
 <template>
   <view class="pkRecord">
     <view class="bg">
-      <image class="bgImg" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/HomeBackground.png" mode="scaleToFill" />
+      <image
+        class="bgImg"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/HomeBackground.png"
+        mode="scaleToFill"
+      />
     </view>
     <view class="Return" @click="onBack">
-      <image class="ReturnImg" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png" mode="scaleToFill" />
+      <image
+        class="ReturnImg"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png"
+        mode="scaleToFill"
+      />
     </view>
     <view class="title">PK记录</view>
     <!-- 导航栏 -->
@@ -32,7 +40,7 @@
     <!-- 内容 -->
     <view class="content">
       <scroll-view
-      show-scrollbar="false"
+        show-scrollbar="false"
         scroll-y="true"
         class="scroll"
         refresher-enabled="true"
@@ -43,48 +51,58 @@
         :refresher-triggered="triggered"
         v-if="pkRecordlist.length !== 0"
       >
-        <uni-card  v-for="(item, index) in pkRecordlist" :key="index" >
-        <view class="card" @click="onItemClick(item)">
-          <!-- 主播A -->
-          <view class="AnchorA">
-            <view class="AnchorAImg">
-              <!-- 头像 -->
-              <image class="AnchorAImgcss" :src="item.anchorIconA" mode="scaleToFill" />
-            </view>
-             <!-- 皇冠 -->
-             <image class="Crown" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png" mode="scaleToFill" v-if="item.winnerAnchorId == item.anchorIdA"/>
-            <view class="AnchorAinfo">
-              <view class="AnchorAname"> {{ item.anchorIdA }} </view>
-              <view class="AnchorATime">{{ formatDate(item.pkTime) }}</view>
-              <view class="AnchorAICon" v-if="item.userACoins!== null">
-                <view class="AnchorAIContext">实际金币:</view>
-                <view class="AnchorAIConNum">{{ item.userACoins}}K</view>
+        <uni-card v-for="(item, index) in pkRecordlist" :key="index">
+          <view class="card" @click="onItemClick(item)">
+            <!-- 主播A -->
+            <view class="AnchorA">
+              <view class="AnchorAImg">
+                <!-- 头像 -->
+                <image class="AnchorAImgcss" :src="item.anchorIconA" mode="scaleToFill" />
+              </view>
+              <!-- 皇冠 -->
+              <image
+                class="Crown"
+                src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
+                mode="scaleToFill"
+                v-if="item.winnerAnchorId == item.anchorIdA"
+              />
+              <view class="AnchorAinfo">
+                <view class="AnchorAname"> {{ item.anchorIdA }} </view>
+                <view class="AnchorATime">{{ formatDate(item.pkTime) }}</view>
+                <view class="AnchorAICon" v-if="item.userACoins !== null">
+                  <view class="AnchorAIContext">实际金币:</view>
+                  <view class="AnchorAIConNum">{{ formatCoinNum(item.userACoins) }}</view>
+                </view>
               </view>
             </view>
-          </view>
-          <!-- 图标 -->
-          <view class="vstext">
-            <view class="Vtext">V</view>
-            <view class="Stext">S</view>
-          </view>
-          <!-- 主播B -->
-          <view class="AnchorB">
-            <view class="AnchorBinfo">
-              <view class="AnchorAname">{{ item.anchorIdB }} </view>
-              <view class="AnchorATime"> {{ formatDate(item.pkTime) }} </view>
-              <view class="AnchorAICon" v-if="item.userBCoins!== null">
-                <view class="AnchorAIContext">实际打金币:</view>
-                <view class="AnchorAIConNum">{{ item.userBCoins }}K</view>
+            <!-- 图标 -->
+            <view class="vstext">
+              <view class="Vtext">V</view>
+              <view class="Stext">S</view>
+            </view>
+            <!-- 主播B -->
+            <view class="AnchorB">
+              <view class="AnchorBinfo">
+                <view class="AnchorAname">{{ item.anchorIdB }} </view>
+                <view class="AnchorATime"> {{ formatDate(item.pkTime) }} </view>
+                <view class="AnchorAICon" v-if="item.userBCoins !== null">
+                  <view class="AnchorAIContext">实际打金币:</view>
+                  <view class="AnchorAIConNum">{{ formatCoinNum(item.userBCoins) }}</view>
+                </view>
               </view>
+              <view class="AnchorAImg">
+                <!-- 头像 -->
+                <image class="AnchorBImgcss" :src="item.anchorIconB" mode="scaleToFill" />
+              </view>
+              <!-- 皇冠 -->
+              <image
+                class="Crown"
+                src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
+                mode="scaleToFill"
+                v-if="item.winnerAnchorId == item.anchorIdB"
+              />
             </view>
-            <view class="AnchorAImg">
-              <!-- 头像 -->
-              <image class="AnchorBImgcss" :src="item.anchorIconB" mode="scaleToFill" />
-            </view>
-            <!-- 皇冠 -->
-            <image class="Crown" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png" mode="scaleToFill" v-if="item.winnerAnchorId == item.anchorIdB"/>
           </view>
-        </view>
         </uni-card>
       </scroll-view>
       <view v-if="pkRecordlist.length === 0" class="nodata">暂无内容</view>
@@ -112,20 +130,20 @@ export default {
   },
   onLoad() {
     uni.getStorage({
-        key: "userinfo",
-        success: (res) => {
-            this.userinfo = res.data;
-          this.getPkRecordList(1);
-          this.getPkRecordList(2);
-        },
-      });
+      key: "userinfo",
+      success: (res) => {
+        this.userinfo = res.data;
+        this.getPkRecordList(1);
+        this.getPkRecordList(2);
+      },
+    });
   },
   onShareAppMessage(res) {
-    if (res.from === 'menu') {
+    if (res.from === "menu") {
       return {
-        title: '分享',
-        path: "/pages/Home/Home"
-      }
+        title: "分享",
+        path: "/pages/Home/Home",
+      };
     }
   },
   computed: {
@@ -137,13 +155,33 @@ export default {
     },
   },
   methods: {
+    //金币数量格式化
+    formatCoinNum(coin) {
+      if (coin === null || coin === undefined) {
+        return "";
+      }
+      if (coin < 1000) {
+        return String(coin);
+      }
+      if (coin >= 1000000) {
+        return "1M+";
+      }
+      const kValue = coin / 1000;
+      const formattedString = kValue.toFixed(2); // 确保至少保留两位小数
+      const matchResult = formattedString.match(/^\d+\.\d{0,2}/);
+      if (matchResult === null) {
+        return kValue.toFixed(2) + "k"; // 确保至少保留两位小数
+      }
+      const formatted = matchResult[0];
+      return `${formatted}k`;
+    },
     onRefresherRefresh() {
       this.pkRecordlist = [];
       this.triggered = true;
       this.page = 0;
       if (this.current === 1) {
         this.pkmyRecordlist = [];
-      }else{
+      } else {
         this.pkInvitationRecordlist = [];
       }
       this.getPkRecordList(this.current);
@@ -153,21 +191,19 @@ export default {
       this.getPkRecordList(this.current);
     },
     onItemClick(item) {
-        uni.navigateTo({
-            url: "/pages/Mine/minecomponents/DetailsPKRecords/DetailsPKRecords",
-            success: (res) => {
-              res.eventChannel.emit("itemDetail", {
-                item: item,
-              });
-            },
+      uni.navigateTo({
+        url: "/pages/Mine/minecomponents/DetailsPKRecords/DetailsPKRecords",
+        success: (res) => {
+          res.eventChannel.emit("itemDetail", {
+            item: item,
           });
+        },
+      });
     },
     onBack() {
-      uni.navigateBack(
-        {
-          delta: 1,
-        }
-      );
+      uni.navigateBack({
+        delta: 1,
+      });
     },
     formatDate: formatDate,
     //获取我发布的PK记录列表
@@ -185,17 +221,17 @@ export default {
       }).then((res) => {
         if (res.code === 200) {
           this.triggered = false;
-            if (type === 1) {
-              this.pkmyRecordlist.push(...res.data);
-              if (this.current === 1) {
-                this.pkRecordlist = this.pkmyRecordlist;
-              }
-            } else {
-              this.pkInvitationRecordlist.push(...res.data);
-              if (this.current === 2) {
-                this.pkRecordlist = this.pkInvitationRecordlist;
-              }
+          if (type === 1) {
+            this.pkmyRecordlist.push(...res.data);
+            if (this.current === 1) {
+              this.pkRecordlist = this.pkmyRecordlist;
             }
+          } else {
+            this.pkInvitationRecordlist.push(...res.data);
+            if (this.current === 2) {
+              this.pkRecordlist = this.pkInvitationRecordlist;
+            }
+          }
         } else {
           console.log(res.msg);
         }
@@ -207,7 +243,7 @@ export default {
       this.slidetext = val === 1 ? "我发布的PK" : "我邀请的PK";
       if (val === 1) {
         this.pkRecordlist = this.pkmyRecordlist;
-      }else{
+      } else {
         this.pkRecordlist = this.pkInvitationRecordlist;
       }
     },
@@ -360,8 +396,8 @@ export default {
   color: #58d8db;
   text-align: center;
   font-weight: bold;
-  white-space: nowrap;   /* 防止换行 */
-  overflow: hidden;      /* 隐藏溢出内容 */
+  white-space: nowrap; /* 防止换行 */
+  overflow: hidden; /* 隐藏溢出内容 */
   text-overflow: ellipsis; /* 显示省略号 */
 }
 .AnchorATime {
@@ -405,11 +441,11 @@ export default {
   border-bottom: #5ddadd solid 2rpx;
   border-right: #5ddadd solid 2rpx;
 }
-.Crown{
-    width: 45.8rpx;
-    height: 39.12rpx;
-    margin-left: -40rpx;
-    margin-top: -100rpx;
+.Crown {
+  width: 45.8rpx;
+  height: 39.12rpx;
+  margin-left: -40rpx;
+  margin-top: -100rpx;
 }
 .vstext {
   display: flex;
@@ -428,5 +464,4 @@ export default {
   font-style: italic;
   margin-right: 26rpx;
 }
-
 </style>

pages/PKMessageprocessing/PKMessageprocessing.vue

@@ -9,7 +9,11 @@
     </view>
     <view class="Navigation">
       <view class="Return" @click="goBack">
-        <image class="Return" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png" mode="scaleToFill" />
+        <image
+          class="Return"
+          src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png"
+          mode="scaleToFill"
+        />
       </view>
     </view>
     <view class="Content">
@@ -134,11 +138,18 @@
         </view>
       </view>
       <!-- 邀请信息 -->
-      <view class="button" v-if="PkIDInfodata.pkStatus === 0 && ReceiverData.senderId !== id">
+      <view
+        class="button"
+        v-if="PkIDInfodata.pkStatus === 0 && ReceiverData.senderId !== id"
+      >
         <button class="accept" @click="AcceptHint()">接受邀请</button>
         <button class="reject" @click="RefuseHint()">拒绝邀请</button>
       </view>
-      <view v-if="ReceiverData.senderId === id && PkIDInfodata.pkStatus === 0" class="button buttontext">等待对方接受邀请</view>
+      <view
+        v-if="ReceiverData.senderId === id && PkIDInfodata.pkStatus === 0"
+        class="button buttontext"
+        >等待对方接受邀请</view
+      >
       <view v-if="PkIDInfodata.pkStatus === 1" class="button buttontext">已接受邀请</view>
       <view v-if="PkIDInfodata.pkStatus === 2" class="button buttontext">已拒绝邀请</view>
     </view>
@@ -188,16 +199,18 @@ export default {
     this.customData = JSON.parse(options.customData);
     setTimeout(() => {
       this.getPkIDInfo();
-    this.getPkyourInfo();
-    this.getPkmineInfo();
-    }, 500);
+      this.getPkyourInfo();
+      this.getPkmineInfo();
+    }, 1000);
   },
   onShareAppMessage(res) {
-    if (res.from === 'menu') {
+    if (res.from === "menu") {
       return {
-        title: '分享',
-        path: `${getCurrentPages()[getCurrentPages().length - 1].route}?customData=${JSON.stringify(this.customData)}`,
-      }
+        title: "分享",
+        path: `${
+          getCurrentPages()[getCurrentPages().length - 1].route
+        }?customData=${JSON.stringify(this.customData)}`,
+      };
     }
   },
   methods: {
@@ -209,7 +222,7 @@ export default {
         data: {
           id: this.customData.id,
         },
-        userInfo: true
+        userInfo: true,
       }).then((res) => {
         console.log(res.data);
         this.PkIDInfodata = res.data;
@@ -222,11 +235,22 @@ export default {
         method: "POST",
         data: {
           id: this.customData.pkIdA,
+          userId: this.id,
+          from: 2,
         },
         userInfo: false,
       }).then((res) => {
-        console.log(res.data);
-        this.SenderData = res.data;
+        console.log(res);
+        if (res.code === 200) {
+          console.log(res.data);
+          this.SenderData = res.data;
+        }else{
+          wx.showToast({
+            title: "获取发布者信息失败",
+            icon: "none",
+            duration: 2000,
+          });
+        }
       });
     },
     //被邀请者
@@ -236,11 +260,21 @@ export default {
         method: "POST",
         data: {
           id: this.customData.pkIdB,
+          userId: this.id,
+          from: 2,
         },
         userInfo: false,
       }).then((res) => {
+        if (res.code === 200) {
         console.log(res.data);
         this.ReceiverData = res.data;
+        }else{
+          wx.showToast({
+            title: "获取被邀请者信息失败",
+            icon: "none",
+            duration: 2000,
+          });
+        }
       });
     },
     //返回上一页
@@ -251,17 +285,17 @@ export default {
     },
     formatDate: formatDate,
     //接受邀请提示
-    AcceptHint(){
-      this.$refs.popups.open('center');
+    AcceptHint() {
+      this.$refs.popups.open("center");
     },
-    closeHint(){
+    closeHint() {
       this.$refs.popups.close();
     },
     //拒绝邀请提示
-    RefuseHint(){ 
-      this.$refs.Refusepopup.open('center');
+    RefuseHint() {
+      this.$refs.Refusepopup.open("center");
     },
-    RefuseHintcloseHint(){
+    RefuseHintcloseHint() {
       this.$refs.Refusepopup.close();
     },
     //操作
@@ -277,23 +311,23 @@ export default {
       }).then((res) => {
         const Hinttext = status === 1 ? "接受邀请成功" : "拒绝邀请成功";
         if (res.code === 200) {
-            this.getPkIDInfo()
-            this.$refs.popups.close();
-            this.$refs.Refusepopup.close();
-            wx.showToast({
-              title: Hinttext,
-              icon: "success",
-              duration: 2000,
-            });
-            wx.navigateBack({
-              delta: 1,
-            });
-        }else {
-            wx.showToast({
-              title: "操作失败",
-              icon: "none",
-              duration: 2000,
-            });
+          this.getPkIDInfo();
+          this.$refs.popups.close();
+          this.$refs.Refusepopup.close();
+          wx.showToast({
+            title: Hinttext,
+            icon: "success",
+            duration: 2000,
+          });
+          wx.navigateBack({
+            delta: 1,
+          });
+        } else {
+          wx.showToast({
+            title: "操作失败",
+            icon: "none",
+            duration: 2000,
+          });
         }
       });
     },
@@ -457,11 +491,10 @@ export default {
   align-items: center;
   margin-top: 150rpx;
 }
-.buttontext{
+.buttontext {
   font-size: 40rpx;
   color: #666666;
   font-weight: bold;
-  
 }
 .accept {
   width: 325.38rpx;
@@ -484,7 +517,7 @@ export default {
   font-size: 28.63rpx;
   line-height: 77.29rpx;
 }
-.popup-Hintcontent{
+.popup-Hintcontent {
   width: 600rpx;
   height: 500rpx;
   background-repeat: no-repeat;
@@ -502,7 +535,7 @@ export default {
   font-weight: bold;
   margin-bottom: 30rpx;
 }
-.popup-texts{
+.popup-texts {
   margin-left: 50rpx;
   color: #7e7e7e;
   font-size: 26rpx;

pages/index/chat/chat.vue

@@ -21,13 +21,13 @@
       @click="onMore(false)"
       :style="{
         bottom:
-          MoreStatus || KeyboardHeight != 0 || Elementheight != 0
+          MoreStatus || KeyboardHeight != 0
             ? MoreStatus
               ? 650 + Elementheight + 'rpx'
               : KeyboardHeight != 0
               ? KeyboardHeight + Elementheight + 'rpx'
-              : Elementheight + 'rpx'
-            : Elementheight + 'rpx',
+              :'10vh'
+            : '10vh',
       }"
     >
       <scroll-view
@@ -53,18 +53,47 @@
             <view class="oppositeChatNews" v-if="item.senderId == userId">
               <image class="chat-avatarImg" :src="avatar" mode="scaleToFill" />
               <view class="oppositesharpCorner">
-                <view class="oppositeSharpCornercion"></view>
+                <view
+                  class="oppositeSharpCornercion"
+                  v-if="item.type == 'text' || item.type == 'audio'"
+                ></view>
               </view>
-              <view class="oppositeChatNewsContent">
+              <view
+                class="oppositeChatNewsContent"
+                :style="{
+                  backgroundColor:
+                    item.type == 'text' || item.type == 'audio' ? '#7bbd0093' : '#ffffff',
+                }"
+              >
                 <!-- 消息类型 -->
+                <!-- 文字消息 -->
                 <textmessage
                   v-if="item.type == 'text'"
                   :messagetext="item.payload.text"
                 ></textmessage>
+                <!-- 自定义PK消息 -->
                 <customPKMessage
                   v-if="item.type == 'pk'"
                   :message="item.payload"
                 ></customPKMessage>
+                <!-- 图片消息 -->
+                <imageMessage
+                  v-if="item.type == 'image'"
+                  :message="item.payload"
+                ></imageMessage>
+                <!-- 视频消息 -->
+                <videoMessage
+                  v-if="item.type == 'video'"
+                  :message="item.payload"
+                ></videoMessage>
+                <!-- 语音消息 -->
+                <voiceMessage
+                  v-if="item.type == 'audio'"
+                  :message="item.payload"
+                  :senderId="item.senderId"
+                  :userId="userinfo.id"
+                >
+                </voiceMessage>
               </view>
             </view>
             <!-- 自己消息 -->
@@ -75,18 +104,49 @@
                 mode="scaleToFill"
               />
               <view class="mysharpCorner">
-                <view class="mySharpCornercion"></view>
+                <view
+                  class="mySharpCornercion"
+                  v-if="item.type == 'text' || item.type == 'audio'"
+                ></view>
               </view>
-              <view class="myChatNewsContent">
+              <view
+                class="myChatNewsContent"
+                :style="{
+                  backgroundColor:
+                    item.type == 'text' || item.type == 'audio' ? '#7bbd0093' : '#ffffff',
+                }"
+              >
                 <!-- 消息类型 -->
+                <!-- 文字消息 -->
                 <textmessage
                   v-if="item.type == 'text'"
                   :messagetext="item.payload.text"
                 ></textmessage>
+                <!-- 自定义PK消息 -->
                 <customPKMessage
                   v-if="item.type == 'pk'"
                   :message="item.payload"
                 ></customPKMessage>
+                <!-- 图片消息 -->
+                <imageMessage
+                  v-if="item.type == 'image'"
+                  :message="item.payload"
+                ></imageMessage>
+                <!-- 视频消息 -->
+                <videoMessage
+                  v-if="item.type == 'video'"
+                  :message="item.payload"
+                ></videoMessage>
+                <!-- 语音消息 -->
+                <voiceMessage
+                  v-if="item.type == 'audio'"
+                  :message="item.payload"
+                  :senderId="item.senderId"
+                  :userId="userinfo.id"
+                  :playbackStatus="playbackStatus"
+                  @notplayVoice="notplayVoice"
+                >
+                </voiceMessage>
               </view>
             </view>
           </view>
@@ -108,7 +168,33 @@
             : '0',
       }"
     >
-      <view class="textareacomponent">
+      <view class="Voice">
+        <view class="MicrophoneImg" v-if="!voiceStatus" @click="onVoice(!voiceStatus)">
+          <image
+            class="Microphonepng"
+            src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Microphone.png"
+            mode="scaleToFill"
+          />
+        </view>
+        <view class="KeyboardImg" v-if="voiceStatus" @click="onVoice(!voiceStatus)">
+          <image
+            class="Keyboardpng"
+            src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Keyboard.png"
+            mode="scaleToFill"
+          />
+        </view>
+      </view>
+      <view class="textareacomponent" v-if="voiceStatus">
+        <view
+          class="VoiceInput"
+          @touchstart="voiceTouchstart"
+          @touchend="voiceTouchend"
+          @touchmove="voiceTouchmove"
+          @touchcancel="voiceTouchcancel"
+          >按住&nbsp;说话</view
+        >
+      </view>
+      <view class="textareacomponent" v-if="!voiceStatus">
         <textarea
           v-model="content"
           @input="SendInput"
@@ -117,6 +203,7 @@
           :maxlength="500"
           cursor-spacing="20"
           @focus="onFocus"
+          :focus="inputfocus"
           @blur="onBlur"
           :adjust-position="false"
         ></textarea>
@@ -177,23 +264,56 @@
         ></InvitationComponents>
       </view>
     </view>
+    <!-- 语音组件 -->
+    <view class="popUpVoice" :style="{ top: voicepopUpstart == false ? '100vh' : '0' }">
+      <view
+        class="popUpvoiceContent"
+        :style="{ bottom: voicepopUpstart == false ? '-1000rpx' : '0' }"
+      >
+        <view class="voiceCenter">
+          <view class="gifModule">
+            <video
+              class="video-player"
+              src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Recording.mp4"
+              :autoplay="true"
+              :loop="true"
+              :controls="false"
+            ></video>
+          </view>
+          <view
+            class="CancelModule"
+            :style="{ backgroundColor: voiceCancelOrSend ? '#ebebeb' : '#000000a9' }"
+          >
+            取消
+          </view>
+          <view
+            class="btnModule"
+            :style="{ backgroundColor: !voiceCancelOrSend ? '#ebebeb' : '#000000a9' }"
+          >
+            {{ voiceCancelOrSend ? "取消" : "松手发送" }}
+          </view>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 
 <script>
 import textmessage from "./messageComponent/textmessage";
 import customPKMessage from "./messageComponent/customPKMessage";
+import imageMessage from "./messageComponent/imageMessage";
+import videoMessage from "./messageComponent/videoMessage";
+import voiceMessage from "./messageComponent/voiceMessage";
 import InvitationComponents from "./moreMessageComponents/InvitationComponents";
 import { generateId } from "../../../components/ChatId.js";
 import TimeFormatting from "../../../components/TimeFormatting.js";
-import picturesVideosMessages from "../../../components/picturesVideosMessages.js";
-import audioMessages from "../../../components/audioMessages.js";
 import request from "../../../components/request.js";
 import {
   getConversationMessages,
   sendMessage,
   messageRead,
   sendCustomMessage,
+  sendGroupMessage,
 } from "../../../components/goEasyTool/tool.js";
 import GoEasy from "goeasy";
 export default {
@@ -225,12 +345,23 @@ export default {
       myitem: null, //直接发送自定义消息的我的选中主播
       youritem: null, //直接发送自定义消息的对方选中主播
       type: null, //直接发送自定义消息的消息类型
+      voiceStatus: false, // 语音状态
+      inputfocus: false, // 输入框焦点状态
+      voicepopUpstart: false, // 语音长按状态/false关闭/true开启
+      voiceCancelOrSend: false, // 语音取消/发送/false发送/true取消
+      recorderManager: uni.getRecorderManager(),
+      playbackStatus: true, // 语音播放状态
       popUpList: [
         {
-          name: "相册",
+          name: "图片",
           icon: "https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Album.png",
           type: "Album",
         },
+        {
+          name: "视频",
+          icon: "https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Video.png",
+          type: "Video",
+        },
         {
           name: "邀请",
           icon: "https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/chat_invite.png",
@@ -249,6 +380,41 @@ export default {
     this.onPage = false;
   },
   onLoad(options) {
+    this.recorderManager.onStop((res) => {
+      console.log("录音结束", res);
+      if(this.ioshide != 0){
+        if(res.fileSize<20*1024){
+        uni.showToast({
+          title:"您说话太短",
+          icon: "none",
+          duration: 2000,
+        });
+      }else{
+        if (this.voiceCancelOrSend) {
+          this.voiceCancelOrSend = false;
+        }else{
+        this.sendVoice(res)
+        this.voiceCancelOrSend = false;
+      }
+      }
+      }else{
+      if(res.fileSize<2*1024){
+        uni.showToast({
+          title:"您说话太短",
+          icon: "none",
+          duration: 2000,
+        });
+      }else{
+        if (this.voiceCancelOrSend) {
+          this.voiceCancelOrSend = false;
+        }else{
+        this.sendVoice(res)
+        this.voiceCancelOrSend = false;
+      }
+      }
+    }
+    });
+
     uni.getStorage({
       key: "userinfo",
       success: (res) => {
@@ -307,6 +473,117 @@ export default {
     this.getscrollviewheight();
   },
   methods: {
+    //暂停所有播放
+    notplayVoice(type) {
+      this.playbackStatus = type;
+    },
+    //发送录音
+    sendVoice(res) {
+      const im = this.$goeasy.im;
+      var message = im.createAudioMessage({
+        file: res,
+        to: {
+          type: GoEasy.IM_SCENE.PRIVATE,
+          id: this.userId, //对方用户id
+          data: { avatar: this.avatar, nickname: this.nickname },
+        },
+        onProgress: function (event) {
+          console.log("file uploading:", event);
+        }, //获取上传进度
+      });
+      sendGroupMessage(this.$goeasy, message).then((ress) => {
+        this.ElementPositioning = ress.id = generateId();
+        ress.timestampStatus = this.checkInterval(ress.timestamp);
+        this.chatList.push(ress);
+        this.judgescrollTop = false;
+      });
+    },
+    //长按语音
+    voiceTouchstart() {
+      console.log("长按语音");
+      this.voicepopUpstart = true;
+      this.recorderManager.start();
+      this.notplayVoice(false);
+    },
+    //松开语音
+    voiceTouchend() {
+      setTimeout(() => {
+        this.recorderManager.stop();
+      }, 100);
+      console.log("松开语音");
+      this.voicepopUpstart = false;
+    },
+    //移动语音
+    voiceTouchmove(event) {
+      const threshold = uni.getSystemInfoSync().windowHeight * 0.86;
+      try {
+        if (event.touches[0].clientY > threshold) {
+          this.voiceCancelOrSend = false;
+        } else {
+          this.voiceCancelOrSend = true;
+        }
+      } catch (e) {}
+    },
+    //中断语音
+    voiceTouchcancel() {
+      console.log("中断语音");
+      this.voicepopUpstart = false;
+      this.voiceCancelOrSend = false;
+    },
+    //语音切换
+    onVoice(status) {
+      this.checkRecordPermission();
+      if (status) {
+        this.inputfocus = false;
+        this.MoreStatus = false;
+      } else {
+        this.inputfocus = true;
+      }
+      this.voiceStatus = status;
+    },
+    //录音权限
+    checkRecordPermission() {
+      // 检查当前录音权限状态
+      uni.getSetting({
+        success: (res) => {
+          const hasPermission = res.authSetting["scope.record"];
+          if (hasPermission === undefined) {
+            this.requestPermission();
+          } else if (!hasPermission) {
+            this.voiceStatus = false;
+            uni.showModal({
+              title: "权限提示",
+              content: "需要录音权限才能正常使用功能，请在设置中开启",
+              confirmText: "去开启",
+              success: (modalRes) => {
+                if (modalRes.confirm) {
+                  uni.openSetting({
+                    success: (settingRes) => {
+                      if (settingRes.authSetting["scope.record"] === true) {
+                        this.checkRecordPermission();
+                      }
+                    },
+                  });
+                }
+              },
+            });
+          }
+        },
+      });
+    },
+    //请求录音权限
+    requestPermission() {
+      uni.authorize({
+        scope: "scope.record",
+        fail: (err) => {
+          this.voiceStatus = false;
+          uni.showToast({
+            title: "请授予麦克风权限，否则可能导致语音功能异常",
+            icon: "none",
+          });
+        },
+      });
+    },
     //直接发送自定义消息
     sendCustomMessage() {
       request({
@@ -493,7 +770,12 @@ export default {
         this.judgescrollTop = false;
       }
       this.getscrollviewheight();
-      this.MoreStatus = Status;
+      if (Status) {
+        this.MoreStatus = Status;
+        this.voiceStatus = false;
+      } else {
+        this.MoreStatus = Status;
+      }
       const query = uni.createSelectorQuery().in(this);
       query
         .select(".inputComponent")
@@ -505,35 +787,69 @@ export default {
     //更多消息类型弹窗点击事件
     onMoreItem(type) {
       if (type == "Album") {
-        this.onSendMedia(); //发送图片，视频消息
+        this.onSendMedia(); //发送图片
+      } else if (type == "Video") {
+        this.onSendVideo(); //发送视频
       } else {
         this.MoreItemStatus = type;
       }
     },
-    //发送图片，视频消息
-    onSendMedia() {
-      //picturesVideosMessages
-      uni.chooseMedia({
-        count: 9,
-        mediaType: ["image", "video"],
+    //发送视频
+    onSendVideo() {
+      var im = this.$goeasy.im;
+      uni.chooseVideo({
         sourceType: ["album", "camera"],
-        maxDuration: 60,
-        camera: "front",
-        success(res) {
-          console.log(res.tempFiles);
-          if (res.tempFiles.fileType == "image") {
-
-
-          }else if (res.tempFiles.fileType == "video") {
-            
-
-          }
+        success: (res) => {
+          var message = im.createVideoMessage({
+            file: res, //H5获得的视频file对象， Uniapp和小程序调用chooseVideo，success时得到的res对象
+            to: {
+              type: GoEasy.IM_SCENE.PRIVATE,
+              id: this.userId, //对方用户id
+              data: { avatar: this.avatar, nickname: this.nickname },
+            },
+            onProgress: function (event) {
+              console.log("file uploading:", event);
+            }, //获取上传进度
+          });
+          sendGroupMessage(this.$goeasy, message).then((res) => {
+            this.ElementPositioning = res.id = generateId();
+            res.timestampStatus = this.checkInterval(res.timestamp);
+            this.chatList.push(res);
+            this.judgescrollTop = false;
+          });
         },
       });
     },
-    //发送音频消息
-    onSendAudio() {
-      //audioMessages
+    //发送图片
+    onSendMedia() {
+      var im = this.$goeasy.im;
+      uni.chooseImage({
+        count: 9, //默认9
+        sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
+        sourceType: ["album", "camera"], //从相册选择
+        success: (res) => {
+          const tempFiles = res.tempFiles;
+          tempFiles.forEach((item, index) => {
+            var message = im.createImageMessage({
+              file: item,
+              to: {
+                type: GoEasy.IM_SCENE.PRIVATE,
+                id: this.userId,
+                data: { avatar: this.avatar, nickname: this.nickname },
+              },
+              onProgress: function (event) {
+                console.log("上传进度", event);
+              }, //获取上传进度
+            });
+            sendGroupMessage(this.$goeasy, message).then((res) => {
+              this.ElementPositioning = res.id = generateId();
+              res.timestampStatus = this.checkInterval(res.timestamp);
+              this.chatList.push(res);
+              this.judgescrollTop = false;
+            });
+          });
+        },
+      });
     },
     // 获取键盘高度
     onFocus(event) {
@@ -591,6 +907,9 @@ export default {
     textmessage,
     InvitationComponents,
     customPKMessage,
+    imageMessage,
+    videoMessage,
+    voiceMessage,
   },
 };
 </script>
@@ -731,7 +1050,6 @@ export default {
 .myChatNewsContent {
   width: auto;
   height: auto;
-  background-color: #7bbd0093;
   border-radius: 20rpx;
   max-width: 450rpx;
 }
@@ -740,6 +1058,43 @@ export default {
   height: 80rpx;
   border-radius: 10rpx;
 }
+.Voice {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 50rpx;
+  margin-left: 10rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.KeyboardImg {
+  width: 70rpx;
+  height: 70rpx;
+  border-radius: 50rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.Keyboardpng {
+  width: 100%;
+  height: 100%;
+  border-radius: 50rpx;
+}
+.MicrophoneImg {
+  margin-top: 5rpx;
+  width: 53rpx;
+  height: 53rpx;
+  border: 4rpx solid #424242;
+  border-radius: 50rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.Microphonepng {
+  width: 80%;
+  height: 80%;
+  border-radius: 50rpx;
+}
 .textareacomponent {
   width: 570rpx;
   height: auto;
@@ -754,6 +1109,18 @@ export default {
   overflow-wrap: break-word;
   margin-left: 30rpx;
 }
+.VoiceInput {
+  width: 95%;
+  background-color: #ffffff;
+  height: 60rpx;
+  border-radius: 10rpx;
+  padding: 10rpx;
+  overflow-wrap: break-word;
+  margin-left: 30rpx;
+  line-height: 60rpx;
+  text-align: center;
+  color: #000;
+}
 .sendComponent {
   margin-left: 40rpx;
 }
@@ -816,6 +1183,15 @@ export default {
   transition: top 0.25s ease;
   z-index: 1000;
 }
+.popUpVoice {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 1000;
+  background-color: #8b8b8bd7;
+}
+
 .popUpInvitationContent {
   position: absolute;
   left: 0;
@@ -826,4 +1202,55 @@ export default {
   border-top-left-radius: 40rpx;
   border-top-right-radius: 40rpx;
 }
+.popUpvoiceContent {
+  position: absolute;
+  left: 0;
+  right: 0;
+  height: 1000rpx;
+  /* transition: bottom 0.1s ease; */
+  /* background-color: #ebebeb; */
+}
+.gifModule {
+  padding: 20rpx;
+  border-radius: 20rpx;
+  overflow: hidden;
+  height: 120rpx;
+  background-color: #232123;
+}
+.voiceCenter {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+}
+.video-player {
+  width: 300rpx;
+  height: 300rpx;
+  border-radius: 20rpx;
+  margin-top: -94rpx;
+}
+.CancelModule {
+  width: 95%;
+  height: 100rpx;
+  text-align: center;
+  line-height: 100rpx;
+  background-color: #000000a9;
+  font-size: 30rpx;
+  color: #999999;
+  border-radius: 50rpx;
+  margin-top: 500rpx;
+}
+.btnModule {
+  width: 100%;
+  height: 200rpx;
+  background-color: #000000;
+  color: #999999;
+  font-size: 30rpx;
+  text-align: center;
+  line-height: 200rpx;
+  border-top-left-radius: 50%;
+  border-top-right-radius: 50%;
+}
 </style>

pages/index/chat/messageComponent/customPKMessage.vue

@@ -13,7 +13,7 @@
     export default {
         props: {
             message: {
-                type: String,
+                type: Object,
                 default: ''
             }
         },

pages/index/chat/messageComponent/fullscreen/imagePreview.vue

@@ -0,0 +1,114 @@
+<template>
+  <view class="image-preview" @click="goBack">
+    <view></view>
+    <image class="image" :src="url" mode="aspectFill"></image>
+    <view class="Localbtn" @click.stop>
+      <image
+        class="Local"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Local.png"
+        mode="aspectFit"
+        @click="saveImage"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url: "",
+    };
+  },
+  onLoad(options) {
+    this.url = options.url;
+  },
+  methods: {
+    //返回上一页
+    goBack() {
+      wx.navigateBack({
+        delta: 1,
+      });
+    },
+    //保存图片
+    saveImage() {
+        uni.showLoading({
+        title: '正在下载图片...',
+        mask: true
+      });
+      
+      // 下载网络图片到临时文件
+      uni.downloadFile({
+        url: this.url,
+        success: (downloadRes) => {
+          if (downloadRes.statusCode === 200) {
+            // 保存到相册
+            uni.saveImageToPhotosAlbum({
+              filePath: downloadRes.tempFilePath,
+              success: () => {
+                uni.hideLoading();
+                uni.showToast({
+                  title: '保存成功',
+                  icon: 'none',
+                  duration: 2000
+                });
+              },
+              fail: (saveErr) => {
+                uni.hideLoading();
+                uni.showToast({
+                  title: '保存失败: ' + saveErr.errMsg,
+                  icon: 'none',
+                  duration: 2000
+                });
+              }
+            });
+          } else {
+            uni.hideLoading();
+            uni.showToast({
+              title: '下载失败',
+              icon: 'none',
+              duration: 2000
+            });
+          }
+        },
+        fail: (downloadErr) => {
+          uni.hideLoading();
+          uni.showToast({
+            title: '下载失败: ' + downloadErr.errMsg,
+            icon: 'none',
+            duration: 2000
+          });
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.image-preview {
+  width: 100vw;
+  height: 100vh;
+  background-color: black;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+}
+.image {
+  width: 100vw;
+  object-fit: contain;
+}
+.Localbtn {
+  width: 100vw;
+  height: 50rpx;
+  margin-bottom: 50rpx;
+  display: flex;
+  flex-direction: row-reverse;
+}
+.Local {
+  width: 50rpx;
+  height: 50rpx;
+  margin-right: 50rpx;
+}
+</style>

pages/index/chat/messageComponent/fullscreen/videoPreview.vue

@@ -0,0 +1,130 @@
+<template>
+  <view class="image-preview">
+    <view class="top">
+        <image
+            class="Fork"
+            src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/crossCross.png"
+            mode="scaleToFill"
+            @click="goBack() "
+        />
+    </view>
+    <video class="image" :src="url" mode="aspectFill"></video>
+    <view class="Localbtn" @click.stop>
+      <image
+        class="Local"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Local.png"
+        mode="aspectFit"
+        @click="saveImage"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url: "",
+    };
+  },
+  onLoad(options) {
+    this.url = options.url;
+  },
+  methods: {
+    //返回上一页
+    goBack() {
+      wx.navigateBack({
+        delta: 1,
+      });
+    },
+    //保存图片
+    saveImage() {
+      uni.showLoading({
+        title: "正在下载视频...",
+        mask: true,
+      });
+
+      // 下载网络图片到临时文件
+      uni.downloadFile({
+        url: this.url,
+        success: (downloadRes) => {
+          if (downloadRes.statusCode === 200) {
+            // 保存到相册
+            uni.saveVideoToPhotosAlbum({
+              filePath: downloadRes.tempFilePath,
+              success: () => {
+                uni.hideLoading();
+                uni.showToast({
+                  title: "保存成功",
+                  icon: "none",
+                  duration: 2000,
+                });
+              },
+              fail: (saveErr) => {
+                uni.hideLoading();
+                uni.showToast({
+                  title: "保存失败: " + saveErr.errMsg,
+                  icon: "none",
+                  duration: 2000,
+                });
+              },
+            });
+          } else {
+            uni.hideLoading();
+            uni.showToast({
+              title: "下载失败",
+              icon: "none",
+              duration: 2000,
+            });
+          }
+        },
+        fail: (downloadErr) => {
+          uni.hideLoading();
+          uni.showToast({
+            title: "下载失败: " + downloadErr.errMsg,
+            icon: "none",
+            duration: 2000,
+          });
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.image-preview {
+  width: 100vw;
+  height: 100vh;
+  background-color: black;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+}
+.image {
+  width: 100vw;
+  object-fit: contain;
+}
+.Localbtn {
+  width: 100vw;
+  height: 50rpx;
+  margin-bottom: 50rpx;
+  display: flex;
+  flex-direction: row-reverse;
+}
+.Local {
+  width: 50rpx;
+  height: 50rpx;
+  margin-right: 50rpx;
+}
+.Fork{
+    width: 60rpx;
+    height: 60rpx;
+    margin-left: 50rpx;
+}
+.top{
+    margin-top: 110rpx;
+    width: 100vw;
+}
+</style>

pages/index/chat/messageComponent/imageMessage.vue

@@ -0,0 +1,55 @@
+<template>
+    <view class="image-message" @click="imadeFullScreen">
+        <image class="image" :style="{width: imageWidth + 'rpx', height: imageHeight + 'rpx'}" @load="load" :src="message.url" mode="aspectFit"></image>
+    </view>
+</template>
+
+<script>
+    export default {
+        props: {
+            message: {
+                type: Object,
+                default: ''
+            }
+        },
+        data() {
+            return {
+                imageHeight: 0,
+                imageWidth: 0,
+            }
+        },
+        onLoad() {
+            // 页面加载时执行
+        },
+        methods: {
+            load(event) {
+                if (event.detail.height > 400){
+                    this.imageHeight = 400;
+                }else{
+                    this.imageHeight = event.detail.height
+                }
+                if (event.detail.width > 400){
+                    this.imageWidth = 400;
+                }else{
+                    this.imageWidth = event.detail.width
+                }
+            },
+            // 点击图片全屏显示
+            imadeFullScreen(){
+                wx.navigateTo({
+                    url: '/pages/index/chat/messageComponent/fullscreen/imagePreview?url=' + this.message.url
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .image-message{
+    width: 100%;
+    height: 100%;
+    }
+    .image{
+        border-radius: 20rpx;
+    }
+</style>

pages/index/chat/messageComponent/videoMessage.vue

@@ -0,0 +1,58 @@
+<template>
+  <view class="video-message" @click="onTap">
+    <image class="video-player" :src="message.thumbnail.url" mode="scaleToFill" />
+    <image
+      class="Play"
+      src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Play.png"
+      mode="scaleToFill"
+    />
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    message: {
+      type: Object,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      title: "Hello",
+    };
+  },
+  onLoad() {
+    // 页面加载时执行
+  },
+  methods: {
+    onTap() {
+      wx.navigateTo({
+        url:
+          "/pages/index/chat/messageComponent/fullscreen/videoPreview?url=" +
+          this.message.video.url,
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.video-message {
+  width: 450rpx;
+  height: 300rpx;
+  border-radius: 20px;
+  display: flex;
+}
+.video-player {
+  width: 100%;
+  height: 100%;
+  border-radius: 20px;
+}
+.Play {
+  width: 200rpx;
+  height: 200rpx;
+  margin-left: -330rpx;
+  margin-top: 50rpx;
+}
+</style>

pages/index/chat/messageComponent/voiceMessage.vue

@@ -0,0 +1,121 @@
+<template>
+  <view class="voice-message" @click="Play">
+    <view class="voice-message-content" v-if="senderId == userId">
+      <view>{{ floor(message.duration) }}"</view>
+      <image
+        v-if="NumberClicks == 0"
+        class="voice-message-avatar"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/voice.png"
+        mode="scaleToFill"
+      />
+      <view class="voice-message-name" v-if="NumberClicks == 1">播放中...</view>
+      <view class="voice-message-name" v-if="NumberClicks == 2">暂停中...</view>
+    </view>
+
+    <view class="voice-message-content" v-else>
+      <image
+        v-if="NumberClicks == 0"
+        class="voice-message-avatar"
+        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/voice.png"
+        mode="scaleToFill"
+      />
+      <view class="voice-message-name" v-if="NumberClicks == 1">播放中...</view>
+      <view class="voice-message-name" v-if="NumberClicks == 2">暂停中...</view>
+      <view>"{{ floor(message.duration) }}"</view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    message: {
+      type: Object,
+      default: () => ({}),
+    },
+    senderId: {
+      type: String,
+      default: "",
+    },
+    userId: {
+      type: Number,
+    },
+    playbackStatus: {
+      type: Boolean,
+    },
+  },
+  data() {
+    return {
+      innerAudioContext: null,
+      NumberClicks: 0,
+    };
+  },
+  watch: {
+    playbackStatus(newVal) {
+      if (!newVal) {
+        if (this.innerAudioContext) {
+          this.innerAudioContext.pause();
+          this.innerAudioContext.destroy();
+          this.innerAudioContext = null;
+          this.NumberClicks = 0;
+          this.$emit("notplayVoice", true);
+        } else {
+          this.$emit("notplayVoice", true);
+        }
+      } else {
+        this.$emit("notplayVoice", true);
+      }
+    },
+  },
+  methods: {
+    floor(num) {
+      return Math.floor(num);
+    },
+    Play() {
+      this.$emit("notplayVoice", false);
+      setTimeout(() => {
+        this.innerAudioContext = uni.createInnerAudioContext();
+        this.innerAudioContext.src = this.message.url;
+        this.innerAudioContext.onEnded(() => {
+          this.NumberClicks = 0;
+          this.innerAudioContext.destroy();
+          this.innerAudioContext = null;
+        });
+        this.innerAudioContext.onError((res) => {
+          this.NumberClicks = 0;
+          this.innerAudioContext.destroy();
+          this.innerAudioContext = null;
+        });
+
+        this.innerAudioContext.play();
+        this.NumberClicks = 1;
+      }, 500);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.voice-message {
+  padding: 0 20rpx 0 20rpx;
+}
+
+.voice-message-avatar {
+  width: 100rpx;
+  height: 80rpx;
+  margin-left: 10rpx;
+}
+
+.voice-message-content {
+  display: flex;
+  align-items: center;
+}
+
+.voice-message-name {
+  height: 80rpx;
+  margin-left: 10rpx;
+  font-size: 28rpx;
+  color: #999;
+  line-height: 80rpx;
+}
+</style>

pages/pkDetail/pkDetail.vue

@@ -246,6 +246,7 @@ export default {
         data: {
           id: this.inid,
           userId: this.id,
+          from: 1,
         },
         userInfo: true,
       }).then((res) => {