管灌系统农户端微信小程序(嘉峪关应用)
pages/feedback/feedback.js
@@ -2,20 +2,41 @@
  data: {
    recordingSrc: '',
    isRecording: false,
    isshowVoiceMask: true, //是否显示录音中
    voiceTime: 2, //录音时长
    gridConfig: {
      column: 3,
      width: 160,
      height: 160,
    },
    originFiles: [{
        url: 'https://tdesign.gtimg.com/mobile/demos/example4.png',
        name: 'uploaded1.png',
        type: 'image',
      },
      {
        url: 'https://tdesign.gtimg.com/mobile/demos/example6.png',
        name: 'uploaded2.png',
        type: 'image',
      }
    ]
  },
  onLoad() {
    this.recorderManager = wx.getRecorderManager();
    this.recorderManager.onStart(() => {
      console.log('recorder start');
      this.setData({ isRecording: true });
      this.setData({
        isRecording: true
      });
      this.startWaveformDrawing();
    });
    this.recorderManager.onStop((res) => {
      console.log('recorder stop', res);
      const { tempFilePath } = res;
      const {
        tempFilePath
      } = res;
      this.setData({
        recordingSrc: tempFilePath,
        isRecording: false
@@ -25,73 +46,189 @@
    this.recorderManager.onError((res) => {
      console.error(res);
      this.setData({ isRecording: false });
      this.setData({
        isRecording: false
      });
      this.stopWaveformDrawing();
    });
  },
  startRecording() {
    if (this.data.isRecording) return;
    wx.authorize({
      scope: 'scope.record',
      success: () => {
        const options = {
          duration: 60000,
          sampleRate: 44100,
          numberOfChannels: 1,
          encodeBitRate: 192000,
          format: 'aac',
          frameSize: 50
        };
        this.recorderManager.start(options);
      },
      fail: () => {
        wx.showModal({
          title: '授权失败',
          content: '请授权录音功能',
          showCancel: false
        });
      }
  handleRemove(e) {
    console.log("handleRemove");
    const {
      index
    } = e.detail;
    const {
      originFiles
    } = this.data;
    originFiles.splice(index, 1);
    this.setData({
      originFiles,
    });
  },
  stopRecording() {
    if (!this.data.isRecording) return;
    this.recorderManager.stop();
  handleClick() {
    console.log("handleClick");
  },
  startWaveformDrawing() {
    if (this.waveformInterval) return;
    const canvasContext = wx.createCanvasContext('waveform');
    const drawWaveform = () => {
      if (!this.data.isRecording) return;
      // 生成模拟的音量数据
      const data = new Array(100).fill(0).map(() => Math.random() * 100);
      canvasContext.clearRect(0, 0, 300, 100);
      canvasContext.beginPath();
      canvasContext.moveTo(0, 50);
      for (let i = 0; i < data.length; i++) {
        const x = (i / data.length) * 300;
        const y = 50 - data[i] / 2;
        canvasContext.lineTo(x, y);
      }
      canvasContext.lineTo(300, 50);
      canvasContext.stroke();
      canvasContext.draw();
      this.waveformInterval = setTimeout(drawWaveform, 100);
    };
    drawWaveform();
  handleAdd(e) {
    console.log("handleAdd");
    const {
      files
    } = e.detail;
    const {
      originFiles
    } = this.data;
    this.setData({
      originFiles: [...originFiles, ...files], // 此时设置了 fileList 之后才会展示选择的图片
    });
  },
  /**
   * 上传图片
   */
  onUpload() {
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload', // 仅为示例,非真实的接口地址
      filePath: file.url,
      name: 'file',
      formData: {
        user: 'test'
      },
      success: () => {
        this.setData({
          [`fileList[${length}].status`]: 'done',
        });
      },
    });
  },
  //按住按钮
  startHandel () {
    this.setData({
     isShowVoiceMask:true
    })
    console.log("开始录音")
    wx.getRecorderManager().start({
     duration: 0
    })
   },
   //松开按钮
   endHandle () {
    this.setData({
     isShowVoiceMask:false
    })
    console.log("结束")
    const recorderManager = wx.getRecorderManager()
    //录音停止函数
    var that = this;
    wx.getRecorderManager().onStop((res) => {
      const voiceTime =  Math.floor(res.duration/1000)
      console.log('voiceTime',voiceTime);
      that.setData({
        voiceTime
      })
      console.log('res',res);
     const { tempFilePath } = res; //这里松开按钮 会返回录音本地路径
     audio.src = tempFilePath
     console.log(tempFilePath);
     //上传录制的音频到服务器
     // wx.uploadFile({
     //  url: '接口地址' + api.voice, //接口地址
     //  name: 'file', //上传文件名
     //  filePath: tempFilePath,
     //  success: function (res) { //后台返回给前端识别后的文字
     //   var model = res.data
     //   var modeljson = JSON.parse(model)
     //   if (modeljson.status_code == 500) {
     //    wx.showToast({
     //     title: '语音转换失败',
     //     image: '/assets/image/icon/fail@2x.png'
     //    })
     //    return false;
     //   }
     //   if (modeljson.meta.status_code === 200 && !modeljson.data.err_msg) {
     //    var saymessage = modeljson.data.message;
     //    wx.setStorageSync('sayinfo', saymessage)
     //    that.setData({
     //     inpvalue: saymessage
     //    })
     //    setTimeout(() =>{
     //     wx.navigateTo({
     //      url: '../loding/loding'
     //     })
     //    },2000)
     //    setTimeout(() => {
     //     wx.hideLoading();
     //    }, 100)
     //   } else if (modeljson.data.err_msg) {
     //    wx.showToast({
     //     title: '请大声说话',
     //     image: '/assets/image/icon/fail@2x.png'
     //    })
     //    return false;
     //   }
     //  }
     // })
    })
    //触发录音停止
    wx.getRecorderManager().stop()
   },
// 播放
handlePlay(e){
  // 倒计时
  let time = this.data.voiceTime
  audio.play()
  let timer1 = -1,timer2 = -1,timer3 = -1,timer4 = -1,timer5 = -1,timer6 = -1;
  // 第一次播放为0 第二次播放2秒钟
  timer6 = setInterval(()=>{
    console.log('时间',time);
    if(time <= 0){
      this.setData({
        line2Opcity: 1,
        line3Opcity: 1
      })
      clearInterval(timer6)
      clearTimeout(timer2)
      clearTimeout(timer3)
      clearTimeout(timer4)
      clearTimeout(timer5)
      return
    }
    timer2 = setTimeout(()=>{
      console.log('timer2');
      this.setData({
        line2Opcity: 0,
        line3Opcity: 0
      })
    },300)
    timer3 = setTimeout(()=>{
      console.log('timer3');
        this.setData({
          line2Opcity: 1,
          line3Opcity:0
        })
    },600)
    timer4 = setTimeout(()=>{
      console.log('timer4');
        this.setData({
          line2Opcity: 1,
          line3Opcity: 1
      })
    },900)
    timer5 = setTimeout(()=>{
      console.log('timer5');
        this.setData({
          line2Opcity: 0,
          line3Opcity: 0
        })
    },1200)
  },1200)
  // 倒计时
  timer1 = setInterval(()=>{
    time--;
    if(time <= 0){
      clearInterval(timer1)
      return
    }
},1000)
  stopWaveformDrawing() {
    clearTimeout(this.waveformInterval);
    this.waveformInterval = null;
  }
});
}
});