Commit 90e0ebc20f4f53e46ae300d73db345d5bdb34f19

Authored by YunaiV
1 parent 29cf7704

mp:支持 wx-reply 发送音频消息

yudao-ui-admin/src/views/mp/components/wx-reply/main.vue
... ... @@ -19,6 +19,7 @@
19 19 <!-- 情况一:已经选择好素材、或者上传好图片 -->
20 20 <div class="select-item" v-if="objData.url">
21 21 <img class="material-img" :src="objData.url">
  22 + <p class="item-name" v-if="objData.repName">{{objData.repName}}</p> <!-- TODO 芋艿:永久素材,name 字段 -->
22 23 <el-row class="ope-row">
23 24 <el-button type="danger" icon="el-icon-delete" circle @click="deleteObj"></el-button>
24 25 </el-row>
... ... @@ -46,32 +47,29 @@
46 47 </el-dialog>
47 48 </el-row>
48 49 </el-tab-pane>
  50 + <!-- 类型 3:语音 -->
49 51 <el-tab-pane name="voice">
50 52 <span slot="label"><i class="el-icon-phone"></i> 语音</span>
51 53 <el-row>
52   - <div class="select-item2" v-if="objData.repName">
53   - <p class="item-name">{{objData.repName}}</p>
  54 + <div class="select-item2" v-if="objData.url">
  55 + <p class="item-name">{{objData.repName}}</p> <!-- TODO 芋艿:永久素材,name 字段 -->
54 56 <div class="item-infos">
55   - <WxVoicePlayer :objData="Object.assign(tempPlayerObj,{repMediaId: objData.media_id, repName: objData.repName})"></WxVoicePlayer>
  57 + <wx-voice-player :url="objData.url" />
56 58 </div>
57 59 <el-row class="ope-row">
58 60 <el-button type="danger" icon="el-icon-delete" circle @click="deleteObj"></el-button>
59 61 </el-row>
60 62 </div>
61   - <div v-if="!objData.repName">
  63 + <div v-else>
62 64 <el-row style="text-align: center">
63 65 <el-col :span="12" class="col-select">
64 66 <el-button type="success" @click="openMaterial">素材库选择<i class="el-icon-circle-check el-icon--right"></i></el-button>
65 67 </el-col>
66 68 <el-col :span="12" class="col-add">
67   - <el-upload :action="actionUrl" :headers="headers" multiple :limit="1" :on-success="handleUploadSuccess"
68   - :file-list="fileList"
69   - :before-upload="beforeVoiceUpload"
70   - :data="uploadData">
  69 + <el-upload :action="actionUrl" :headers="headers" multiple :limit="1" :file-list="fileList" :data="uploadData"
  70 + :before-upload="beforeVoiceUpload" :on-success="handleUploadSuccess">
71 71 <el-button type="primary">点击上传</el-button>
72   - <div slot="tip" class="el-upload__tip">
73   - 格式支持mp3/wma/wav/amr,文件大小不超过2M,播放长度不超过60s
74   - </div>
  72 + <div slot="tip" class="el-upload__tip">格式支持 mp3/wma/wav/amr,文件大小不超过 2M,播放长度不超过 60s</div>
75 73 </el-upload>
76 74 </el-col>
77 75 </el-row>
... ... @@ -247,11 +245,12 @@
247 245 this.tableLoading = true
248 246 // 校验格式
249 247 const isType = file.type === 'audio/mp3'
  248 + || file.type === 'audio/mpeg'
250 249 || file.type === 'audio/wma'
251 250 || file.type === 'audio/wav'
252 251 || file.type === 'audio/amr';
253 252 if (!isType) {
254   - this.$message.error('上传语音格式不对!');
  253 + this.$message.error('上传语音格式不对!' + file.type);
255 254 return false;
256 255 }
257 256 // 校验大小
... ... @@ -314,9 +313,10 @@
314 313 let tempObjItem = this.tempObj.get(this.objData.type)
315 314 // console.log(this.objData.type)
316 315 // console.log(tempObjItem)
317   - console.log(this.objData)
  316 + // console.log(this.objData)
318 317 // console.log(this.tempObj)
319 318 if (tempObjItem) {
  319 + console.log(this.tempObj)
320 320 this.objData.content = tempObjItem.content ? tempObjItem.content : null
321 321 this.objData.mediaId = tempObjItem.mediaId ? tempObjItem.mediaId : null
322 322 this.objData.url = tempObjItem.url ? tempObjItem.url : null
... ... @@ -329,6 +329,7 @@
329 329 }
330 330 // 如果获取不到,需要把 objData 复原
331 331 this.objData.mediaId = undefined;
  332 + this.objData.url = undefined;
332 333 this.objData.content = undefined;
333 334 // this.$delete(this.objData,'repName')
334 335 // this.$delete(this.objData,'repMediaId')
... ... @@ -348,8 +349,7 @@
348 349  
349 350 // 创建 tempObjItem 对象,并设置对应的值
350 351 let tempObjItem = {}
351   - tempObjItem.type = this.objData.type
352   - tempObjItem.mediaId = item.mediaId
  352 +
353 353 // tempObjItem.repMediaId = item.mediaId // TODO 芋艿:应该可以注释吧?
354 354 // tempObjItem.content = item.content // TODO 芋艿:应该可以注释吧?
355 355  
... ... @@ -363,6 +363,9 @@
363 363 this.objData.repThumbUrl = item.url
364 364 this.dialogThumbVisible = false // TODO 芋艿:这里为什么单独写???
365 365 } else{
  366 + tempObjItem.type = this.objData.type;
  367 + tempObjItem.mediaId = item.mediaId;
  368 + tempObjItem.url = item.url;
366 369 // tempObjItem.repName = item.name
367 370 // tempObjItem.url = item.url
368 371 // this.objData.repName = item.name
... ... @@ -408,12 +411,11 @@
408 411 deleteObj() {
409 412 if (this.objData.type === 'news') {
410 413 // TODO 芋艿,待实现
411   - } else if(this.objData.type === 'image') {
  414 + } else if(this.objData.type === 'image'
  415 + || this.objData.type === 'voice') {
412 416 this.$delete(this.objData, 'url')
413 417 this.$delete(this.objData, 'mediaId')
414   - } else if(this.objData.type === 'voice') {
415   - // TODO 芋艿,待实现
416   - } else if(this.objData.type === 'video') {
  418 + } else if(this.objData.type === 'video') {
417 419 // TODO 芋艿,待实现
418 420 } else if(this.objData.type === 'music') {
419 421 // TODO 芋艿,待实现
... ... @@ -443,7 +445,7 @@
443 445 *
444 446 * why?不确定为什么 v-model="objData.content" 不能自动缓存,所以通过这样的方式
445 447 */
446   - inputContent() {
  448 + inputContent(str) {
447 449 let tempObjItem = {...this.objData};
448 450 this.tempObj.set(this.objData.type, tempObjItem);
449 451 }
... ...