Skip to content

Commit 8766834

Browse files
YunaiVYunaiV
committed
mp：增加【语音】【视频】的素材选择
1 parent 7e6c1f2 commit 8766834

File tree

2 files changed

+72
-54
lines changed

2 files changed

+72
-54
lines changed

‎src/views/mp/components/wx-material-select/main.vue

Lines changed: 57 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -23,45 +23,59 @@
2323
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
2424
@pagination="getMaterialPage"/>
2525
</div>
26-
<div v-else-if="objData.type == 'voice'">
27-
<!-- TODO 芋艿：需要翻译 -->
28-
<!-- <avue-crud ref="crud"-->
29-
<!-- :page="page"-->
30-
<!-- :data="tableData"-->
31-
<!-- :table-loading="tableLoading"-->
32-
<!-- :option="tableOptionVoice"-->
33-
<!-- @on-load="getPage"-->
34-
<!-- @size-change="sizeChange"-->
35-
<!-- @refresh-change="refreshChange">-->
36-
<!-- <template slot-scope="scope"-->
37-
<!-- slot="menu">-->
38-
<!-- <el-button type="text"-->
39-
<!-- icon="el-icon-circle-plus"-->
40-
<!-- size="small"-->
41-
<!-- plain-->
42-
<!-- @click="selectMaterial(scope.row)">选择</el-button>-->
43-
<!-- </template>-->
44-
<!-- </avue-crud>-->
26+
<!-- 类型：语音 -->
27+
<div v-else-if="objData.type === 'voice'">
28+
<!-- 列表 -->
29+
<el-table v-loading="loading" :data="list">
30+
<el-table-column label="编号" align="center" prop="mediaId" />
31+
<el-table-column label="名字" align="center" prop="name" />
32+
<el-table-column label="语音" align="center">
33+
<template v-slot="scope">
34+
<wx-voice-player :url="scope.row.url" />
35+
</template>
36+
</el-table-column>
37+
<el-table-column label="上传时间" align="center" prop="createTime" width="180">
38+
<template v-slot="scope">
39+
<span>{{ parseTime(scope.row.createTime) }}</span>
40+
</template>
41+
</el-table-column>
42+
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
43+
<template v-slot="scope">
44+
<el-button size="mini" type="text" icon="el-icon-circle-plus"
45+
@click="selectMaterial(scope.row)">选择</el-button>
46+
</template>
47+
</el-table-column>
48+
</el-table>
49+
<!-- 分页组件 -->
50+
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
51+
@pagination="getMaterialPage"/>
4552
</div>
46-
<div v-else-if="objData.type == 'video'">
47-
<!-- TODO 芋艿：需要翻译 -->
48-
<!-- <avue-crud ref="crud"-->
49-
<!-- :page="page"-->
50-
<!-- :data="tableData"-->
51-
<!-- :table-loading="tableLoading"-->
52-
<!-- :option="tableOptionVideo"-->
53-
<!-- @on-load="getPage"-->
54-
<!-- @size-change="sizeChange"-->
55-
<!-- @refresh-change="refreshChange">-->
56-
<!-- <template slot-scope="scope"-->
57-
<!-- slot="menu">-->
58-
<!-- <el-button type="text"-->
59-
<!-- icon="el-icon-circle-plus"-->
60-
<!-- size="small"-->
61-
<!-- plain-->
62-
<!-- @click="selectMaterial(scope.row)">选择</el-button>-->
63-
<!-- </template>-->
64-
<!-- </avue-crud>-->
53+
<div v-else-if="objData.type === 'video'">
54+
<!-- 列表 -->
55+
<el-table v-loading="loading" :data="list">
56+
<el-table-column label="编号" align="center" prop="mediaId" />
57+
<el-table-column label="标题" align="center" prop="title" />
58+
<el-table-column label="介绍" align="center" prop="introduction" />
59+
<el-table-column label="视频" align="center">
60+
<template v-slot="scope">
61+
<wx-video-player :url="scope.row.url" />
62+
</template>
63+
</el-table-column>
64+
<el-table-column label="上传时间" align="center" prop="createTime" width="180">
65+
<template v-slot="scope">
66+
<span>{{ parseTime(scope.row.createTime) }}</span>
67+
</template>
68+
</el-table-column>
69+
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
70+
<template v-slot="scope">
71+
<el-button size="mini" type="text" icon="el-icon-circle-plus"
72+
@click="selectMaterial(scope.row)">选择</el-button>
73+
</template>
74+
</el-table-column>
75+
</el-table>
76+
<!-- 分页组件 -->
77+
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
78+
@pagination="getMaterialPage"/>
6579
</div>
6680
<div v-else-if="objData.type == 'news'">
6781
<div class="waterfall" v-loading="loading">
@@ -95,14 +109,18 @@
95109
// import { tableOptionVoice } from '@/const/crud/wxmp/wxmaterial_voice'
96110
// import { tableOptionVideo } from '@/const/crud/wxmp/wxmaterial_video'
97111
import WxNews from '@/views/mp/components/wx-news/main.vue';
112+
import WxVoicePlayer from '@/views/mp/components/wx-voice-play/main.vue';
113+
import WxVideoPlayer from '@/views/mp/components/wx-video-play/main.vue';
98114
import { getMaterialPage } from "@/api/mp/material";
99115
// import {getPage as getPageNews} from '@/api/wxmp/wxfreepublish'
100116
// import {getPage as getPageNewsDraft} from '@/api/wxmp/wxdraft'
101117
102118
export default {
103119
name: "wxMaterialSelect",
104120
components: {
105-
WxNews
121+
WxNews,
122+
WxVoicePlayer,
123+
WxVideoPlayer
106124
},
107125
props: {
108126
objData: {

‎src/views/mp/components/wx-reply/main.vue

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
<!-- 情况一：已经选择好素材、或者上传好图片 -->
2020
<div class="select-item" v-if="objData.url">
2121
<img class="material-img" :src="objData.url">
22-
<p class="item-name" v-if="objData.repName">{{objData.repName}}</p> <!-- TODO 芋艿：永久素材，name 字段 -->
22+
<p class="item-name" v-if="objData.name">{{objData.name}}</p>
2323
<el-row class="ope-row">
2424
<el-button type="danger" icon="el-icon-delete" circle @click="deleteObj"></el-button>
2525
</el-row>
@@ -54,7 +54,7 @@
5454
<span slot="label"><i class="el-icon-phone"></i> 语音</span>
5555
<el-row>
5656
<div class="select-item2" v-if="objData.url">
57-
<p class="item-name">{{objData.repName}}</p> <!-- TODO 芋艿：永久素材，name 字段 -->
57+
<p class="item-name">{{objData.name}}</p>
5858
<div class="item-infos">
5959
<wx-voice-player :url="objData.url" />
6060
</div>
@@ -315,22 +315,17 @@
315315
this.objData.content = tempObjItem.content ? tempObjItem.content : null
316316
this.objData.mediaId = tempObjItem.mediaId ? tempObjItem.mediaId : null
317317
this.objData.url = tempObjItem.url ? tempObjItem.url : null
318+
this.objData.name = tempObjItem.url ? tempObjItem.name : null
318319
319320
// TODO 芋艿：临时注释掉，看看有没用
320-
// this.objData.repName = tempObjItem.repName ? tempObjItem.repName : null
321-
// this.objData.repMediaId = tempObjItem.repMediaId ? tempObjItem.repMediaId : null
322321
// this.objData.repDesc = tempObjItem.repDesc ? tempObjItem.repDesc : null
323322
return;
324323
}
325324
// 如果获取不到，需要把 objData 复原
325+
this.objData.content = undefined;
326326
this.objData.mediaId = undefined;
327327
this.objData.url = undefined;
328-
this.objData.content = undefined;
329-
// this.$delete(this.objData,'repName')
330-
// this.$delete(this.objData,'repMediaId')
331-
// this.$delete(this.objData,'mediaId')
332-
// this.$delete(this.objData,'url')
333-
// this.$delete(this.objData,'content') // TODO 芋艿：貌似删除了，文本无法输入
328+
this.objData.name = undefined;
334329
// this.$delete(this.objData,'repDesc')
335330
},
336331
/**
@@ -357,12 +352,16 @@
357352
tempObjItem.hqMusicUrl = this.objData.hqMusicUrl
358353
} else if (this.objData.type === 'image'
359354
|| this.objData.type === 'voice') {
360-
tempObjItem.mediaId = item.mediaId;
355+
tempObjItem.mediaId = item.mediaId
361356
this.objData.mediaId = item.mediaId
362-
tempObjItem.url = item.url;
363-
this.objData.url = item.url
364-
// tempObjItem.repName = item.name
365-
// this.objData.repName = item.name
357+
if (item.url) {
358+
tempObjItem.url = item.url;
359+
this.objData.url = item.url;
360+
} else { // 必须使用 $delete 删除，否则 vue 监听不到数据
361+
this.$delete(this.objData, 'url');
362+
}
363+
tempObjItem.name = item.name
364+
this.objData.name = item.name
366365
} else if (this.objData.type === 'video') {
367366
// getMaterialVideo({
368367
// mediaId:item.mediaId
@@ -401,6 +400,7 @@
401400
this.dialogThumbVisible = false
402401
},
403402
deleteObj() {
403+
console.log('删除！');
404404
if (this.objData.type === 'news') {
405405
// TODO 芋艿，待实现
406406
} else if(this.objData.type === 'image'

0 commit comments

Comments
 (0)