Commit 90e0ebc20f4f53e46ae300d73db345d5bdb34f19
1 parent
29cf7704
mp:支持 wx-reply 发送音频消息
Showing
1 changed file
with
22 additions
and
20 deletions
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 | } | ... | ... |