1. 录音功能优化 2. 防止多个音频同时播放

src/app.ts

@@ -58,6 +58,11 @@ App<IAppOption>({
         });
       },
     });
+
+    wx.setInnerAudioOption({
+      obeyMuteSwitch: false,
+      mixWithOther: false,
+    });
   },
   onShow(options) {
     if (options.query.scene) {

src/components/customAudioBar/index.ts

@@ -28,7 +28,6 @@ Component({
   lifetimes: {
     attached() {
       const innerAudioContext = wx.createInnerAudioContext();
-      innerAudioContext.obeyMuteSwitch = false;
       this.setData({
         innerAudioContext,
       });
@@ -63,6 +62,11 @@ Component({
             play: false,
           });
         });
+        innerAudioContext.onStop(() => {
+          this.setData({
+            play: false,
+          });
+        });
       }
     },
     handlePause() {

src/components/customRecord/index.json

@@ -1,6 +1,7 @@
 {
   "component": true,
   "usingComponents": {
-    "van-popup": "@vant/weapp/popup/index"
+    "van-popup": "@vant/weapp/popup/index",
+    "customAudioBar":"/components/customAudioBar/index"
   }
 }

src/components/customRecord/index.scss

@@ -79,35 +79,68 @@
       top: 0;
       opacity: 1;
       background-color: rgba(0, 0, 0, 0.7);
+    }
+    &.record-ani {
       .record-page-icon {
         width: 200rpx;
         height: 200rpx;
         padding: 56rpx;
-        // border: 28rpx solid rgba(255, 255, 255, 0.25);
         border-radius: 50%;
         animation: grow-bp 0.6s ease-in-out infinite;
         @keyframes grow-bp {
           0% {
             padding: 0;
-            // border-width: 0;
           }
-          // 25% {
-          //   padding: 28rpx;
-          // }
           50% {
             padding: 56rpx;
-            // border-width: 28rpx;
           }
-          // 75% {
-          //   padding: 28rpx;
-          //   border-width: 0;
-          // }
           100% {
             padding: 0;
-            // border-width: 0;
           }
         }
       }
     }
+
+    .dialog {
+      padding: 66rpx 40rpx 44rpx;
+      border-radius: 32rpx;
+      width: 630rpx;
+      box-sizing: border-box;
+      background: linear-gradient(180deg, #e8fdff 0%, #f6f6f6 100%);
+      .audio-bar {
+        border-radius: 90rpx;
+        background-color: #fff;
+      }
+      .d-footer {
+        margin-top: 32rpx;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 18rpx;
+        .cancel {
+          width: 266rpx;
+          height: 84rpx;
+          font-size: 32rpx;
+          color: #333333;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background: #ffffff;
+          border-radius: 94rpx 94rpx 94rpx 94rpx;
+          border: 1px solid #d5d5d5;
+        }
+        .conform {
+          width: 266rpx;
+          height: 88rpx;
+          font-size: 32rpx;
+          color: #ffffff;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background: linear-gradient(90deg, #00b4c5 0%, #54e2b4 100%);
+          border-radius: 94rpx 94rpx 94rpx 94rpx;
+        }
+      }
+    }
   }
 }

src/components/customRecord/index.ts

@@ -17,8 +17,11 @@ Component({
    * 组件的初始数据
    */
   data: {
+    record: false,
     startShow: false,
     show: false,
+    audioObj: {} as any,
+
     recorderManager: null as null | WechatMiniprogram.RecorderManager,
     time: 0,
   },
@@ -47,6 +50,7 @@ Component({
       const { recorderManager } = this.data;
       this.setData({
         show: true,
+        record: true,
       });
       if (this.data.startShow) {
         recorderManager?.start({
@@ -61,8 +65,8 @@ Component({
         recorderManager?.stop();
       }
       this.setData({
-        startShow: false,
-        show: false,
+        // startShow: false,
+        // show: false,
       });
     },
     recorderManagerListen(recorderManager: WechatMiniprogram.RecorderManager) {
@@ -79,17 +83,39 @@ Component({
             title: "录音时间太短",
             icon: "none",
           });
+          this.setData({
+            startShow: false,
+            show: false,
+          });
           return;
         }
+        this.setData({
+          record: false,
+          audioObj: {
+            ...res,
+            duration: Number.parseInt(String(res.duration / 1000)),
+          },
+        });
+      });
+    },
+    handleCancel() {
+      this.setData({
+        startShow: false,
+        show: false,
+        record: false,
+      });
+    },
+    handleConform() {
+      const { audioObj } = this.data;
+      this.handleCancel();
       this.uploadFile({
         fileType: "audio",
-          tempFilePath: res.tempFilePath,
-          size: res.fileSize,
-          duration: res.duration,
+        tempFilePath: audioObj.tempFilePath,
+        size: audioObj.fileSize,
+        duration: audioObj.duration,
       }).then((res) => {
         this.triggerEvent("file", res as object);
       });
-      });
     },
     checkRecordPermission(callback: () => void) {
       wx.getSetting({
@@ -185,7 +211,7 @@ Component({
               expandJson.imgUrl = data.data.SnapshotUrl;
             }
             if (item.fileType === "audio") {
-              expandJson.duration = Number.parseInt(String(item.duration / 1000));
+              expandJson.duration = item.duration;
             }
             resolve(expandJson);
           },
@@ -204,6 +230,7 @@ Component({
       const arr2 = lastString.split("."); //   再以"."作为分隔符
       return arr2[arr2.length - 1]; //将后缀名返回出来
     },
+    noneEnoughPeople() {},
   },
 });
 

src/components/customRecord/index.wxml

@@ -5,9 +5,14 @@
   bind:touchend="handleHide"
   bind:touchcancel="handleHide"
 >
+  <!-- catchtouchmove="noneEnoughPeople" -->
   <slot wx:if="{{slotIcon}}"></slot>
   <image wx:else class="icon" src="{{imageUrl}}record.png?t={{Timestamp}}"></image>
-  <view wx:if="{{startShow}}" class="record-page {{startShow && 'record-pape-start'}} {{show && 'record-page-active'}}">
+  <view
+    wx:if="{{startShow}}"
+    class="record-page {{startShow && 'record-pape-start'}} {{show && 'record-page-active'}} {{ record && 'record-ani'}}"
+  >
+    <block wx:if="{{record}}">
       <view class="record-line">
         <image class="wave" src="{{imageUrl}}wave-white.gif?t={{Timestamp}}"></image>
         <view class="time">{{time}}”</view>
@@ -15,5 +20,15 @@
       <view class="record-page-icon-wrap">
         <image class="record-page-icon" src="{{imageUrl}}record.png?t={{Timestamp}}" mode="scaleToFill"></image>
       </view>
+    </block>
+    <view class="dialog" wx:else>
+      <view class="audio-bar">
+        <customAudioBar url="{{audioObj.tempFilePath}}" time="{{audioObj.duration}}"></customAudioBar>
+      </view>
+      <view class="d-footer">
+        <view class="cancel" bind:tap="handleCancel">取消</view>
+        <view class="conform" bind:tap="handleConform">确定</view>
+      </view>
+    </view>
   </view>
 </view>

src/module1/pages/casesFeedback/index.scss

@@ -212,11 +212,11 @@ page {
             text-overflow: ellipsis;
             max-width: 13em;
           }
-          .preview{
+          .preview {
             font-size: 32rpx;
-            color: #01B4C5;
+            color: #01b4c5;
           }
-          .del{
+          .del {
             position: absolute;
             top: -16rpx;
             right: -16rpx;
@@ -485,7 +485,7 @@ page {
   }
   .btn1 {
     margin-top: 24rpx;
-    padding: 14rpx;
+    padding: 22rpx;
     font-size: 32rpx;
     color: #fff;
     line-height: 44rpx;
@@ -495,7 +495,7 @@ page {
   }
   .btn2 {
     margin-top: 24rpx;
-    padding: 12rpx 14rpx;
+    padding: 20rpx 14rpx;
     font-size: 32rpx;
     color: rgba(1, 180, 197, 1);
     line-height: 44rpx;

src/module1/pages/chatRoom/index.scss

@@ -307,12 +307,12 @@ page {
     .header {
       padding: 32rpx;
       display: flex;
-      gap: 12rpx;
+      gap: 16rpx;
       align-items: center;
       justify-content: space-between;
       .icon {
-        width: 48rpx;
-        height: 48rpx;
+        width: 52rpx;
+        height: 52rpx;
       }
       .place {
         padding: 16rpx 32rpx;
@@ -350,8 +350,8 @@ page {
       }
 
       .icon-add {
-        width: 48rpx;
-        height: 48rpx;
+        width: 52rpx;
+        height: 52rpx;
       }
     }
     .fold-container {

src/module1/pages/chatRoom/index.ts

@@ -62,7 +62,6 @@ Page({
     this.innerAudioContext = wx.createInnerAudioContext({
       useWebAudioImplement: true,
     });
-    this.innerAudioContext.obeyMuteSwitch = false
     app.waitLogin().then(() => {
       this.getAgree();
 
@@ -437,6 +436,12 @@ Page({
           messageList,
         });
       });
+      this.innerAudioContext.onStop(()=>{
+        messageItem.isPlay = false;
+        this.setData({
+          messageList,
+        });
+      })
       this.setData({
         messageList,
       });

src/module1/pages/userInfo/index.wxml

@@ -18,7 +18,7 @@
     <view class="label">医院</view>
     <view class="content">{{userInfo.HospitalName}}</view>
   </view>
-  <view class="row">
+  <view class="row" wx:if="{{userInfo.DoctorLevel>1}}">
     <view class="label">科室</view>
     <view class="picker" bind:tap="handleShowDept">
       <view class="picker-content">
@@ -27,7 +27,7 @@
       </view>
     </view>
   </view>
-  <view class="row">
+  <view class="row"  wx:if="{{userInfo.DoctorLevel>1}}">
     <view class="label">专长</view>
     <view class="content" bind:tap="handleShowDept">
       <view class="all">{{SpecialtyName || '无'}}</view>

src/pages/cases/index.ts

@@ -485,8 +485,8 @@ Page({
   handleQuestion(e) {
     const { index } = e.currentTarget.dataset;
     const message = {
-      1: "设为公开的病历，病历所在科室医生均可访问",
-      2: "标为优质的病历，优质病历平台所有医生均可访问",
+      1: "设为公开的病历，公开病历平台所有医生均可访问",
+      2: "标为优质的病历，病历所在科室医生均可访问",
       3: "属于您所在科室的所有病历",
     }[index];
     wx.showModal({